Campus Ambassador

Girls Who Code


Sign In

Please fill your contact number to start learning

In-depth HTML, CSS & JS

Grasp how modern website are made and it's fundamental concepts.

Projects & Assesment Tests

Doubts Sessions and Practice Tasks

Creative Web Design & Development, Create Modern Web Experience

Learn to design, code and develop awesome websites and web apps, this course covers everything you need to know about developing modern web interfaces and websites.
Live Course
60 classes
Starting on

Recording Available

₹ 4500


In this course, you'll learn how to set up your own boilerplate from scratch with all the HTML, CSS and JavaScript. We’ll teach you the right approach to using plain JavaScript in a website. we’ll cover HTML, Basic & Modern CSS, then integrate it with ES6 JavaScript to animate in and animate out your views in a seamless way.

Course Table of contents What will you learn?

63 Sessions

Certificate of completion

Getting started with Basics

4 session

  • Understanding Web Development
  • History of Web | Future of Web
  • Comparison between epic and bad design
  • Approach to learn better


6 session

  • How to create Structure of Web page with HTML
  • Basic HTML tags
  • Understanding HTML Form
  • Applying images in HTML
  • How to link video to your webpage using video tag in HTML
  • Understanding the difference between Block and Inline HTML elements

Introduction to CSS

5 session

  • What is CSS and how to use it in our HTML page?
  • How to use Style tag in HTML
  • How to style element using Inline CSS
  • How to Create a CSS External Style Sheet
  • Concept of Width and Height in CSS

More on CSS

7 session

  • Basic Properties of CSS
  • Understanding color and background-color property
  • Margin & Padding | Difference between margin and padding
  • How to use Font property in CSS | How to install new Fonts
  • Understanding Image Properties in CSS
  • Understanding Positions Properties in CSS (in-depth)
  • Display | Flex | Flex-box Properties (in-depth)

Project 1

3 session

  • Understanding Project
  • Start building by creating the HTML structure and style it by CSS properties
  • Coding animations using CSS animation

Project 2

3 session

  • Understanding the Complete Project
  • Creating design using HTML & CSS
  • How to handle possible bugs in HTML & CSS

Starting with JavaScript

5 session

  • What is JavaScript? | History of JavaScript | Future of JavaScript
  • Understanding Variables & Constants in JS
  • Basic data types in JS
  • Operators, Loops, Types, Conditionals
  • Learning the basics of the language

Functions and Arrays

7 session

  • Understanding function declaration and function expression
  • Understanding Scope and Hoisting in JS
  • How to create an Array in JS
  • Usage of Array in JS with Example
  • JavaScript Array Methods and Properties
  • JavaScript Objects (In JavaScript, almost "everything" is an object.)
  • Helper Functions in JS

DOM Manipulation

6 session

  • HTML DOM Methods
  • How to access and change the elements of an HTML document using DOM
  • How to change style properties of HTML element using DOM
  • setTimeout() and setInterval() methods
  • Let's Create Bulb using DOM
  • How to move HTML element using DOM

Advance Animation With GSAP

3 session

  • What is GSAP?
  • Creating Animations in a Static Website
  • ScrollTrigger (GSAP's Plugin)

Smooth Scrolling Using Locomotive JS

2 session

  • Applying Locomotive JS in Website
  • Integrating Locomotive With ScrollTrigger

Chrome Dev Tool

4 session

  • Overview of Chrome Dev tool
  • How to find Error and Bugs using Chrome Dev tool
  • How to identify and rectify problems in Chrome Dev tool
  • Some tricks to save your time using Chrome Dev tool

Git & Github

3 session

  • Introduction to Git
  • Basic Git Commands (add, commit, status, pull, push, etc. )
  • How to Upload your Project in GitHub

Major Project

5 session

  • Designing our Final Project
  • Creating the Final Project using HTML & CSS
  • Creating animations and features using JS, GSAP, ScrollTrigger and Locomotive JS
  • Adding auto prefixer in our project
  • Hosting Our Final Project


Frequently asked Questions

Is there a free trial available

  • Yes, 10 classes are completely free.

What if I miss any class? is there any recordings facality available?

  • Yes, recording is also availabe for same class, in case you miss the class you can learn it from recordings.

How classes will be conducted?

  • Initialy We'll use Google meet for live classes and after some time we'll integrate our own online classroom platform for classes.

What will be the timing of this batch?

  • Click on a "Start learning" button, You'll be enrollred for a course, then you can check timing on classroom section for a course.

Will I be eligible to take a job or internship after this course?

  • Definitely you will, Although Sheryians will also help to get your first job or Internship.

What will be learn designing or development?

  • We'll learn both designing and development, After completion of this course you'll be able to think a design and develop it as well.

What'll the duration of this course?

  • Click on a "Start learning" button, You'll be enrollred for a course, then you can check timing on classroom section for a course.

Sample Live Lecture (it's fun)

so that you know, not every online class is boring.

 you'll definitely love it!  you'll definitely love it!    you'll definitely love it! you'll definitely love it!