|
Introduction to Web Development
|
|
|
|
Welcome To Web Development
|
|
|
|
• Overview of the Internet as a network of interconnected computers
|
|
|
|
• How the Internet Works
|
|
|
|
• Introduction to IP addresses and domains
|
|
|
|
• Introduction to Web Browsers
|
|
|
|
• Understanding the role of browsers in accessing the web
|
|
|
|
• How Websites are Hosted
|
|
|
|
• Basics of web hosting and servers
|
|
|
|
• Domain registration and DNS
|
|
|
|
Project - Exploring the Web
|
|
|
|
• Students explore how websites are structured and hosted
|
|
|
|
• Register a simple domain (using free services) and create a basic HTML page
|
|
|
Introduction to Web Development
|
|
|
|
Basic tags and box model in css
|
|
|
Basics Of Web Development
|
|
|
|
• Overview of HTML, CSS, and JavaScript
|
|
|
|
• Setting up a development environment
|
|
|
|
HTML Fundamentals
|
|
|
|
• Understanding HTML structure
|
|
|
|
• Creating a simple webpage
|
|
|
|
CSS Fundamentals
|
|
|
|
• Introduction to styling
|
|
|
|
• Applying styles to HTML elements
|
|
|
|
JavaScript Basics
|
|
|
|
• Introduction to variables, data types, and basic operations
|
|
|
|
• Writing simple scripts
|
|
|
HTML and CSS
|
|
|
Continuing Building portfolio
|
|
|
BoxModel and Position Property in detail
|
|
|
"Crafting Your Digital Presence: HTML & CSS Portfolio Session 🚀💻"
|
|
|
|
Continuing Building portfolio
161:00
|
|
|
Responsive Design and Git
|
|
|
|
Responsive Web Design
|
|
|
|
• Media queries
|
|
|
|
• Flexbox and Grid for layout
|
|
|
|
Introduction to Git and GitHub
|
|
|
|
• Cloning repositories
|
|
|
|
• Basic Git commands
|
|
|
|
Git Collaboration
|
|
|
|
• Branching and merging
|
|
|
|
• Collaborating on GitHub
|
|
|
|
Project - Personal Portfolio
|
|
|
|
• Students create a simple portfolio website
|
|
|
|
• Apply responsive design principles
|
|
|
HTML Forms and basic validation.
|
|
|
Introduction to Frontend Frameworks
|
|
|
|
Introduction to Frontend Frameworks (e.g., Bootstrap)
|
|
|
|
• Using pre-built components
|
|
|
|
• Responsive design with frameworks
|
|
|
|
JavaScript and DOM Manipulation
|
|
|
|
• Introduction to the Document Object Model (DOM)
|
|
|
|
• Dynamic content and events
|
|
|
|
Project - Interactive Webpage
|
|
|
|
• Students create an interactive webpage using JavaScript
|
|
|
|
• Utilize frontend frameworks for styling
|
|
|
|
Introduction to Backend Development
|
|
|
|
• Basics of server, client, and requests
|
|
|
|
• Overview of backend languages (e.g., Node.js)
|
|
|
Embark on Your JavaScript Journey with basic programming construct and DOM manipulation.
|
|
|
|
JavaScript Essential Part 02
|
|
|
Building a Full-Stack Application
|
|
|
|
Introduction to Databases (e.g., MongoDB)
|
|
|
|
Basic Inventory Management using express and mongoDB
|
|
|
|
• Basics of databases and CRUD operations
|
|
|
|
Introduction to Backend Frameworks (e.g., Express.js)
|
|
|
|
• Routing and middleware
|
|
|
|
• Building RESTful APIs
|
|
|
|
Connecting Frontend and Backend
|
|
|
|
• AJAX and asynchronous communication
|
|
|
|
• Integrating frontend and backend components
|
|
|
|
Final Project - Full-Stack Web Application
|
|
|
|
• Students work on a small full-stack project
|
|
|
|
• Apply concepts learned throughout the course
|
|
|
Demystify API's and Create your own API.
|
|
|
Bonus Reward:
|
|
|
|
• Code Review and Troubleshooting Sessions
|
|
|
|
• Guest Speakers and Industry Insights.
|
|
|
|
• Community Building.
|
|
|
|
0416
14:00
|
|
|
Project Review
|
|