Web Development

Level 1

Are you a beginner looking forward to learning how to create websites? We will guide you through the entire process: from how to  write your first line of code to actually creating industry-standard websites for clients using HTML, CSS, Bootstrap, JavaScript, etc.

Course Contents

Self Paced

80 Hours

Mentor LEd

40 Hours

Tests

10+

Assignments

6

Price

$300

With this knowledge you will be able to

Understand how websites work

Set up your domain and hosting and create your own portfolio website

Create professional business websites for corporates

Build eCommerce websites for your clients where they can sell their products

Create blogging websites

Get maintenance and bug fixing jobs for existing websites

Get a good grasp on the concepts of web development setting you up to specialize further in either front-end or back-end web development

Course Curriculum

Course Curriculum

Introduction to the course
How to get the most out of this course
Let’s get the setup done
The document structure and doctype
What are HTML tags ?
Tags for handling text
HTML Lists
Link tags
HTML Tables
Image tags
Conventional and Layout HTML tags
HTML Forms
What is Semantic HTML
Semantic tags (header, footer, section, article)
Semantic tags (aside, main, time, details)
HTML5 video/audio
HTML meta tags
HTML special characters
Assignment: Create a small website structure where you will display information about yourself
What is CSS and how CSS works
Ways to select an element to style
Font and Text styling
The Box Model
Changing colors and backgrounds
CSS layout properties
Advance CSS properties
Pseudo Properties
Transitions and Transform
CSS Flexbox and it’s uses
Media Queries and Breakpoints
Making grids with Flexbox to create a full website layout

Assignment: Style the website structure that you build in last weeks assignment

What is Bootstrap why to use it
How to setup Bootstrap for a project
The Bootstrap Grid
Breakpoints
Rows and Columns
Bootstrap Components and Elements
Bootstrap Utilities
Forms
Helpers
What is SASS and how to use it
Variables
Nesting
Modules
Operators
Mixins
Assignment: Recreate your personal website (that you built in assignment of week 1 & 2) with Bootstrap and SASS and share how easy or difficult it is to use Bootstrap and SASS
Introduction to JavaScript
Let’s write some JavaScript code
JavaScript Variables
Arrays in JavaScript
Data types in JavaScript and Truthy/Falsy Values
Operators in JavaScript
if/else and switch statements
The LOOPS and how to use it to write less code
Data Type Methods
Functions, Function Expressions and IIFE
Using Function as parameters and return values and the Scope chain
Closures

 

What is Asynchronous JavaScript and Promises
An Example of Asynchronous JavaScript
Async-Await, API and Ajax
Making AJAX Calls with Fetch and Async-Await
Assignment: Create and tip calculator with the rules from below

 

Introduction to OOP
Objects in JavaScript
Creating Objects Function Constructors
The “this” keyword
 
What’s new in ES6 JavaScript?
Arrow Functions and Default parameters
Arrays in ES6 and Map method and the Rest Parametre
Destructuring
Classes and Subclasses
What is DOM and how does it work?
Manipulating the DOM for the first time
How to select DOM elements in different ways
Changing styles of elements with DOM Manipulation

 

Handling Events
Special Methods for elements while manipulating the DOM
Good practices while handling events
Assignment: Create a small ludo game with JavaScript
Introduction to the terminal and CMD
Basic commands
What is version control
Git and Github
How to use Github fully
What is Node JS and NPM
Setuping Node JS
Basic package install and packages.json file uses
Why you need Node JS to learn modern JS development
What are JavaScript libraries and why you should learn React
Environment setup and Create-React-App
Understanding the files and the architecture of components
Class Vs Functional Components
Nested components
What is JSX and why it is important
How to write Raw JavaScript and CSS in a JSX file
What is props and how to use it
Prop Drilling and Props Destructuring
Lists in React and .map method and the spread operator
Assignment: Create a small React web application with more than 5 sections
State management
Component lifecycle methods
Styled Components
Module based CSS in a Component
Conditional Rendering
PropTypes

 

Why React Hooks?
useState
General rule of hooks
useEffect and Short-Circuit Evaluation
React Router and how to use in a real web application

 

useMemo
useRef
useReducer
useContext and Context API
useCallback
Handling forms with controlled input
Handling forms with useRef
Fetching Data From an API
Using Axios to get data from an API
Creating a custom React hook that fetches data from an API url
What are external libraries and why you should use them
Using tailwind CSS to create a small tours list application
Let’s create a Markdown Blog
Let’s create an eCommerce website with Material UI
Create your own brand new portfolio website from scratch using the topics of the whole course and share it.

We will also teach you SOFT SKILLS!

because you will need them to excel in the Freelance marketplaces

In addition to learning technical skills, you will also need freelancing skills, mostly tips and tricks on how to win jobs and grow your portfolio.

With our expert mentors who are also professional freelancers, we have created a complete freelancing skills course that will take you from a beginner to an expert in no time.

We will teach you how to find appropriate jobs, write proper cover letters and negotiate to get better rates for your work.

Most of the clients in the Freelance marketplaces communicate in English

To help you become better in your communication and negotiation, we will provide you with an Business English course.

We will start with the basics of the English language and we will teach you everything you need to know to communicate effectively with your clients.

Start learning with us

Let us take you on a journey that will give you the life that you have been dreaming of!

Scroll to Top