-
Notifications
You must be signed in to change notification settings - Fork 83
Frontend
Common: Google App Engine, Flask, AngularJS, Highlight.JS, Bower (package manager) Admin: Bootstrap
There are templates that are the foundation of the page (The student one is server/app/templates/student.html). This defines the basic layout and necessary support files (CSS, JS etc).
Inside the template - we include the Angular app (server/static/js/student.js) that tell us what pieces are needed for that page. It then loads "partials" (example) (which are parts of the page, like the assignment count or the list of assignments).
Each of these partials have some part of the page (example). You'll notice these partials have things that looks like variables {{course.website}}
- this data is filled in by Angular and the data is filled in by the controller (visible at the top of the partial). (The controllers for the student front-end are here
Services perform HTTP requests to the API to get data. Controllers use the services as appropriate to get data - and then the view/partial starts displaying - the partial has access to data in it's "scope". The controller adds the appropriate data to the scope. It also defines functions in the scope that the partial can call
Angular UI-Router. This is how we link to other "pages" in the front-end. The pages are created in the base .js file for the app (ex server/static/js/student.js
). A link between view in an Angular app should use ui-sref
to link to another page.
The Admin interface is based off AdminLTE - For CSS/Components see the AdminLTE documentation/example.
Sentry reports front-end JS errors