Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/tuyojr/altschool-assignments-1

My First Project with AltSchool Africa.
https://github.com/tuyojr/altschool-assignments-1

Last synced: 3 days ago
JSON representation

My First Project with AltSchool Africa.

Awesome Lists containing this project

README

        

![AltSchool Africa Logo](https://github.com/tuyojr/AltSchool-Assignments-1/blob/master/AltSchool.svg)
# AltSchool of Engineering First Semester Assignment 1
Objective: Build a simple HTML & CSS driven web application made up of a few linked pages and styled content

How to: To take and submit this assignment, create an account on [Repl.it](http://Repl.it) using the email address you used to register @altschoolafrica. Create a new project with Replit’s HTML 5 template, and code your solution. While it is okay, and we encourage you to collaborate with your peers, make sure you own your work and build this yourself.

1. Create a HTML page with the following information: Home page which you will call About Me, contact page, register page and login page.

2. The following should be included in your About Me page (which is your home page but will have the name About Me instead):
- Your name
- A sentence about yourself
- Your goal for this Diploma course
- Education (list your past education and certificates)
- Job experience
- Hobbies & other skills

3. Create a Contact section within the page in step (1), using a form with the below fields. The form should have a submit button and basic HTML validation:
- Name
- Email
- Message
- Priority (dropdown)

4. Add a register page. It should have the below fields with HTML validation as well:
- First Name
- Last Name
- Phone
- Gender (dropdon)
- Country
- State/Province
- Username
- Password
- Confirm Password
5. Add a **Login page** with a username field and a password field. Add basic HTML validation to the login form. It should have a submit button with the label of “Sign In”.

6. Add a navigation menu at the top of the home page(**About Me** page). It should contain links to the sections within the page. Also, since you have 4 pages (the home page with your details, the contact page, the register page and the login page), add items to the menu that links the pages together so that there’s no dead end and you can always go from the home page to the others pages and then back to the home page.

7. Create a Calculator page and create a calculator UI in it, using the HTML Table element. You will be back to make the calculator functional, but the goal for now is to make it look great, so apply what you have learnt about HTML & CSS. The Calculator should have:
- A text field at the top.
- Numbers 0 to 9.
- Regular Math operators like addition (+), subtraction (-), multiplication (*), division (/), and modulo (%).

8. Somewhere on the page where it makes sense visually, add a photo of yourself.

9. Bonus: Re-create the calculator UI in a new page, using CSS flexbox instead of using a table like earlier requested.

The live page can be assessed [here](https://altschool-of-engineering-first-semester-assignment-1.tuyojr.repl.co/).