0% found this document useful (0 votes)
28 views7 pages

Course Currcullum

Uploaded by

patchalajohn
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
28 views7 pages

Course Currcullum

Uploaded by

patchalajohn
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 7

The 20 Projects!

This is a list of project names - Please check the website for complete details
with a preview of all projects.

1] The Employee Management App 2] Real To-do List App

3] Online Quiz App. 4] Loading Preview(Shimer UI)

5] OTT Movie App 6] Live User Filter

7] Sticky Notes App. 8] Theme Clock

9] Rotating Nav Animation. 10] Netflix mobile Navigation

11] New Year countdown. 12] Increment Counter

15] Rotating Nav Animation. 16] Sound Board App

17] Split Landing page. 18] Scroll Animation

19] Verify Account UI 20] Exchange rate App

The Projects above are completely built with HTML, CSS, Bootstrap, and
Javascript! All Major advanced are covered in these 20 Projects!
Roadmap

<HTML>
1) What is an Application and the Internet?
2) The course introduction!

What is an actual application and how does it work?


Introduction to HTML.
Types of Developers!
How it works!
Frontend developers vs. backend Developers.
The Role of HTML & CSS.
What is the Internet and How it works?
What is Domain and Hosting
What is Domain and Hosting
Getting Setup System and Tools!
Why Browser and how the application works in the browser!
FrontEnd Cult - Complete course introduction and Syllabus
3) The Basics and Foundation!

Create and open HTML Tags.


Doc Type and Basic Structure.
Heading, Paragraphs, and Typography.
Links, Images, and Attributes!
Tools! Lists and Tables.
Forms and Inputs.
Block and inline Elements.
Div, Class, Span, and Ids.
HTML 5 Semantics Tags.
HTML 5 Semantics Solutions.
{ CSS }

4) CSS Basics! 5) The Project - Hotel Website.

Section Introduction. The Project Intro.


Implementing CSS. Design and Ideas.
Basic CSS Selectors. File Structure and Nav bar.
Dev Tools Intro. Showcase and Home info.
Colors Types. Feature and Footer.
Backgrounds and Borders. About us Page.
Margins & and paddings. Contact Page.
Box Model.
Folats & Alignments.
Link state and Button Stylings.
Navigations and Stylings.
Inline, Block, and inline-block display.
CSS Positioning.
Form Styling challenges and Solutions.
Aside - visibility - order and negative margin.

+91-9553345235
Roadmap

6) Responsiveness and Relative Units! 7) FlexBox!

What is Responsive Design? What is FlexBox?


Intro to Media quires. Flex Basics.
Em & Rm units. Flex Properties.
Vh & VW units. Flex alignement ang Justify.
Making Hotel Website Responsive.

8) Website Deployment - Shared Host 9) More CSS Concepts

Types Of Hosting Accounts. Targeted Selectors.


Shared Hosting Setup. nth-child Pseudo Selector.
Upload Your Site Via FTP. before & after Pseudo Selector.
Box Shadows.
Text Shadows.
CSS Transitions.
Transform Property.

10) CSS Grid

What Is CSS Grid?


Grid Basics & Column.
Spanning Columns & Rows.
Auto-Fit & Minmax
Grid Template Areas
{ BootStrap }
12) Bootstrap Fundamentals - Part 1
11) Intro to Bootstrap 5!

Containers.
Intro to Bootstrap 5.
Typography.
How To Use Bootstrap.
IDisplay & Position.
Initial Environment Setup.
Background & Text Colors.
Bootstrap Sandbox Setup.
Spacing.
Sizing, Borders & Shadows.
Breakpoints.
Buttons.
Navbar.

+91-9553345235
Roadmap
13) Bootstrap Fundamentals - Part 2 14) Dynamic JavaScript Components!

Bootstrap Grid & Columns. Dropdowns.


Flexbox Classes. Accordions & Collapse.
Cards. Carousel Slider.
List Groups & Badges. Toast Notifications.
Forms & Input. Spinners.
Form Validation Display. Modals.
Alerts & Progress Bars. Popovers & Tooltips.
Tables. Darkmode Toggle.
Breadcrumbs & Pagination.
CSS Utilities.

< JavaScript >


16) Variables, Data Types, Methods & More
15) Intro to JavaScript!
The Sandbox Files
Using The Console.
What Is JavaScript?
Comments & Shortcuts.
Tools & Setup Variables & Constants.
Running JavaScript In The Data Types
Browser. Primitive vs Reference Types.
Type Conversion.
Operators.
Type Coercion.
Working With Strings.
Capitalize Challenge
Working With Numbers.
The Math Object.
Capitalize Challenge.
Dates & Times.

18) Functions, Scope & Execution Context.


17) Arrays & Objects
Creating A Function.
Creating Arrays. Arguments & Parameters.
Basic Array Methods. Global & Function Scope.
Nesting, Concat & The Spread Operator. Block Scope.
Object LiteralsSpinners. Nested Scope.
Object Spread Operator & Methods. Declaration vs Expression.
Destructuring & Naming. Arrow Functions.
JSON Intro. Immediately Invoked Function.
Object Challenges. The Call Stack.

+91-9553345235
Roadmap
19) Logic & Control Flow! 20) Loops, Iteration & High Order Array Methods.

If Statements. For Loop.


Else-If & Nesting. Break & Continue.
Switches. While & Do While Loops.
Logical Operators. For...of Loop.
Logical Assignment. For...in Loop.
Ternary Operator. Array.forEach Method.
Array.filter Method
Array.map Method.
Array.reduce Method.
Array Method Challenges

22) Events!
21) DOM Manipulation!

Event Listeners.
Intro To The DOM.
Mouse Events.
Document Element Properties.
The Event Object.
DOM Selectors - Single Elements.
Keyboard Events & Key Properties.
DOM Selectors - Multiple Elements.
Input Events.
Insert Elements, Text & HTML.
Page Loading & Window Events.
Replace Elements.
Remove Elements.
Manipulating Styles & Classes

23) Asynchronous JavaScript 24) Fetch API & Async Await!

How Async JS Works. Fetch Basics.


setTimeout & clearTimeout Functions. Fetch API Error Handling.
setInterval & clearInterval Functions. Async & Await.
HTTP Requests. Error Handling With Async & Await.
Network Tab. Multiple Promises With Async & Await.
Callback Hell.
Promises.
Callback To Promise Refactor.
Promise Chaining.
promise.all().

+91-9553345235
Roadmap
25) Web Browser APIs!

GeoLocation API.
Show Location on a Map.
Web Audio API.
Video API.
Input Events.
Page Loading & Window Events.
LocaStorage.

< React JS>

27) Kickstarting App!


26) Beginning!
Intro to NPM!
Visual Code Setup! Packages and Bundler
Hello World Programe HTML VS Javascript VS ReactJS. Parcel - the Baahubali
Why we need React! Node Modules
Advantages of React! The File library.

28) The Groundwork! 29) The First React App!

Intro to JSX. How reacts Works behind.


Class and Class names JSx. Building app from scratch.
The React Components. The Section of the webpage.
Class and functional-based components. Props and State.
Component compostion. Passing Props to a component.
JSX Expression. Destructing the Props.
Config Driven UI, Data Layer, UI Layer
30) The Hooks! The Map() function.
31) Discover the App!
The file structure of react!
Imports and Exports. Micro Service!
Use Effect Hook.
What is React Hook?
CORS Chrome Ext.
Usestate Hook.
Shimmer UI.
Virtuval Dom.
Conditional Rendering.
React Fiber and Hook and Archiceture On change Handler
Search the site.
Work with API Data.
+91-9553345235
Roadmap
33) The App Route!
32) The Groundwork!
React Root!
Intro to JSX. React-Router-Dom.
Class and Class names JSx. The Use Root error Hook.
The React Components. Children Routes.
Class and functional-based components. Outlet Component.
Component compostion. Link Component.
JSX Expression. Dynamic Routing.
CLient and Serverside Routing.

34) The Data - Master! 35) The Redux Store!

Higher Order components. Redux ToolKit.


Controlled and Uncontrolled Components. React-Redux Packages.
Get the State Up! Redux Store.
React Dev Tools. Redux Dev Tools
Props Drilling!
React Context.

36) The Final Test!

Intro to JEST.
Types of Test.
Setup - Test Environment.
Basic Test Cases.
Render, Query Concept.
Test Cases for component

Keep learning, All The Best!


Manohar Lotlapalli,
frontendcult.com

+91-9553345235

You might also like