amnikhil66 / basic_tasks

Basic Tasks to learn HTML, CSS and JS.

Basic Tasks

A set of simple tasks to get started with learning HTML, CSS and JavaScript.

###General Practices and Instructions to follow:

1. Each task needs to be under a separate directory, for example task 1 will be in a folder named "task_1", task 2 will be in "task_2", so on so forth. Keep the naming convention as shown.
2. Each task will have 3 parts to it:

• The first part is a sub task to create HTML only. This will be under a folder named "html_task".
• The second part is a sub task to create styles for the existing html structure. This will be under a folder named "css_task".
• The third part is a sub task to create JavaScript for the existing html and css. this will be under a folder named "js_task".

3. At the end of each task request for a code review (Completion of a task and not individual sub tasks)
4. Following is how each task folder structure should look like:

• task_1 (Name the task as shown and not by the name of the task)
  • html_task (Will contain only your html task)
    • index.html
  • css_task (Will contain CSS task along with the HTML task from the previous sub-task)
    • index.html
    • css
      • main.css
  • js_task (Will contain JS tasks along with CSS and HTML tasks from the previous sub-task)
    • index.html
    • css
      • main.css
    • js
      • app.js

5. And yes the code for each sub-task has to be re-done in the other sub-tasks. As the tasks mature and you are comfortable with all three of programming paradigms, this practice will be stopped. (No Copy Pasting Allowed of code or files:smile:)

###Task List (The tasks list will grow as time progresses, feel free to suggest any new ideas for tasks)

1. Tasks 1 - Create a simple user registration form.

• HTML Sub Task
  • Create simple form for user registration containing the following fields:
    • First Name
    • Last Name
    • Gender
    • Email ID
    • Password
    • Phone Number
    • Address
    • Personal Description
    • Terms and Conditions
    • Submit and Cancel/Clear
  • For the above HTML, apply styles
  • For the above HTML and CSS apply validation as follows:
    • Mandatory Fields
      • First Name
      • Last Name
      • Gender
      • Email ID
      • Password
      • Terms and Conditions
    • Valid Input checks
      • Name should not contain numbers
      • Email address validity
      • Password check