freeCodeCamp/guide/russian/miscellaneous/front-end-file-structure/index.md

14 lines
3.8 KiB
Markdown
Raw Normal View History

2018-10-12 20:00:59 +00:00
---
title: Front End File Structure
localeTitle: Структура файла фронтального файла
---
Прежде всего: все ваши пользовательские файлы и угловые файлы находятся в **/ client / app /**
1. **app.js** : определяет ваше приложение и включает в себя некоторые основные функции приложения, вам, вероятно, не нужно возиться с ним, если вы не пытаетесь добавить больше зависимостей к вашему приложению. Мы не будем беспокоиться об этом прямо сейчас.
2. **app.css** : **таблица стилей** для всего приложения, вы можете поместить стили здесь, если хотите, но я бы порекомендовал вам поместить их в **main / main.css** , так как эти стили также являются приложениями.
3. **main /** : эта папка содержит то, что пользователь видит первым, когда загружает ваш сайт. **main.html** является шаблоном страницы, **main.js** направляет пользователя в **main.html,** когда пользователь переходит в каталог верхнего уровня вашего сайта, то есть http: //yourapp.wherever.itis/ без / другого / url / hierarchy . Вскоре вы также узнаете, что вы можете определить / url / heirarchy вашего приложения / справедливо / произвольно . Вам не нужно будет редактировать **main.js** или **main.controller.spec.js** , поэтому давайте не будем беспокоиться о них прямо сейчас. Если вы просмотрите файл **main.html,** вы увидите, что он использует _ng-repeat_ для отображения ещей_ в _awesomeThings_ . Где он _выглядит потрясающе_ ?
4. **main / main.controller.js** : все функции javascript, которые вы хотите использовать для прямого взаимодействия с пользователем, перейдите сюда! Вы поместите функции здесь, чтобы взаимодействовать с вашим API, обновлять представления для своего пользователя и т. Д. Здесь _awesomeThings_ извлекаются из вашей базы данных и добавляются в локальную область, поэтому ваше представление HTML может отображать их! Как круто! Через минуту мы добавим пользовательские объекты в вашу базу данных.
Большой! Теперь вы знаете, как взаимодействовать с пользователем! Но что, если вы хотите, чтобы ваше приложение имело другую страницу, которая делает что-то еще? Может быть, **main.html** показывает домашнюю страницу, но вы хотите, чтобы страница показывала форму для добавления опроса? возможно, http: //yourapp.wherever.itis/newpage ? Именно здесь вам удобен генератор.
[ПРЕДЫДУЩИЙ](http://forum.freecodecamp.com/t/guides-to-back-end-projects/14265) СЛЕДУЮЩИЙ