1 Create an AngularJS 1.5 Project with Typescript 2
2 Include Twitter Bootstrap 3.3.6 and Angular Bootstrap
3 Setup a project structur
4 Setup sass structur
5 Setup a routing
6 Create a landing page. See Screenshot landing-page
a landing page contains two action buttons
b first will lead to a registration
c second will open a login screen
d use placeholder images
7 Create login page. This will be a mock.
a login page has two inputs and a submit button
b action will lead to a list view (see below)
c login form fields in lg have 4 columns and are centered
d on xs they have 100% width
8 Create a registration page. This will be a mock.
a this will be a form with various input fields
i first name
ii family name
iii date of birth
iv password
v e-mail
b all field are required
c registration shall only pass, when all field are filled
d date of birth needs a custom validation
i has to be a valid date
ii user has to be older then 18 years
e after passing, you should go to login screen
9 Create a list overview
a get a result list from a server (use a open api to get a json)
b order list by name
c by clicking a list item, details page is opened
d list view items containing: title, image, description
10 Create a details page
a display all data from this item
b on xs show only title and image
c on xs by clicking on title open an expandable area below title with all
informations
11 All layouts should use the 4 bootstrap breakpoints