FPT SOFTWARE

FRESHER ACADEMY
FRONTEND BASICS
TUAN CAT (FHO.FA)
9/17/2018

[Type the abstract of the document here. The abstract is typically a short summary of the
contents of the document. Type the abstract of the document here. The abstract is typically a
short summary of the contents of the document.]
Contents
Objective ............................................................................................................................................ 2
Business needs .................................................................................................................................. 2
Working requirements ...................................................................................................................... 2
Technologies ..................................................................................................................................... 2

1|Page
 Assignment topic : Frontend Lab FRESHER
Assignment duration : 60 minutes ACADEMY

Objective
- Create new login form include 2 fields:
o Email
o Password
- Login form has cancel button, and forgot password link
- Login form can validate email, password fields:
o Email cannot blank, and correct email
o Password cannot blank, and at least 5 characters’ long
Business needs
- TBD
Working requirements
Working environment: CODE VISUAL.
Technologies
The product implements one or more technology:
- HTML
- CSS
- Javascript and Jquery

2|Page
Project Descriptions
1. Step 1: create files in our lab
a. Create new file login.html

b. Create new file main.css. this file need to keep all css data
c. Create new file main.js. this file need to keep all javascript code
d. Create img folder to keep images resource of project
e. After, check your project’s structure

f. Update login.html

2. Step 2: Build login page by html

a. Navigate to login.html. And update this file:
i. Build header of page

ii. Build login form include: form, avatar image, submit button, forgot link
3|Page
3. Step 3: Build css for login page
a. Build css layout for login page

4|Page
 b. Build css for login form

5|Page
 c. Build css for image avatar

---
The End!

6|Page