Web Development

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.

*Please check our requirements before applying

Apply Now

Course Contents

Self Paced

80 Hours

Mentor LEd

40 Hours

Tests

10+

Assignments

6

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

  • Chapter 01: Introduction
  • Chapter 02: HTML Basics
  • Chapter 03: Advanced HTML
  • Chapter 04: Creating a full website structure in HTML
  • Chapter 05: Fundamentals of of CSS
  • Chapter 06: Advanced CSS
  • Chapter 07: CSS Flexbox
  • Chapter 08: Lets Style our HTML website structure
  • Chapter 09: Fundamentals of Bootstrap 5
  • Chapter 10: Advance Bootstrap 5
  • Chapter 11: Dart SASS
  • Chapter 12: Lets create a Responsive Landing with Bootstrap and SASS
  • Chapter 13: Fundamentals of Javascript and JS syntax
  • Chapter 14: Conditionals, Data Types and Operators
  • Chapter 15: Functions, Loops, Methods of Data Types
  • Chapter 16: Asynchronous and Advance JavaScript
  • Chapter 17: Object Oriented Programming with JavaScript
  • Chapter 18: ES6 and Modern JavaScript
  • Chapter 19: Document Object Model (DOM) Manipulation with JavaScript
  • Chapter 20: The missing pieces of DOM and handling Events
  • Chapter 21: Version Control and the Terminal
  • Chapter 22: Introduction to Node JS and NPM
  • Chapter 23: Fundamentals of React
  • Chapter 24: JSX, Props and Lists
  • Chapter 25: Advance React Topics
  • Chapter 26: Basic React Hooks and Router
  • Chapter 27: Advance React Hooks
  • Chapter 28: Forms, API’s, External UI Libraries and Custom React Hooks
  • Chapter 29: Project - A Markdown Blog
  • Chapter 30: Project - An app that finds github users using the Github API
  • Chapter 31: Project - A blog website where all blog data is benign pulled from an API
  • Chapter 32: Project - An Ecommerce Project using Material UI
  • Chapter 33: Final Course Assignment

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
Creating an app that finds github users
Lets create a blog website with an API
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.

Apply Now To Get Started

Click on the button below to apply. We will let you know the results and the timing of the final program.

Apply Now
Scroll to Top
Scroll to Top