CCBP 4.0 Intensive

Why should you take the Intensive Course?

• Build a strong foundation in front-end web development and design with essential web technologies like HTML, CSS, and Bootstrap, enabling you to create professional static and responsive websites.
• Learn modern responsive web design techniques using advanced CSS layouting (Flexbox, Grid) and utility-first frameworks like Tailwind CSS for adaptable and efficient UI development.
• Become proficient in Python programming fundamentals, including syntax, problem-solving skills, and Object-Oriented Programming principles to build modular software.
• Develop strong fundamentals in Databases and DBMS, allowing you to perform powerful SQL queries and manage relational (MySQL) and non-relational (MongoDB) databases effectively.
• Master JavaScript for building dynamic and interactive web applications, covering DOM manipulation, asynchronous operations with `fetch` and `async/await`, and modern ES6 features.
• Become a Full Stack Developer with comprehensive expertise in the MERN stack (MongoDB, Express.js, React.js, Node.js), enabling you to architect and build end-to-end web applications.
• Build stateful and dynamic web applications with ReactJS, covering key concepts such as components, state management (`useState`, `useEffect`), routing, authentication, authorization, and React Context.
• Learn to create secure RESTful APIs using Node.js and Express.js, handling HTTP requests, integrating with databases, performing CRUD operations, and implementing authentication with JWT.
• Gain the ability to develop performant and SEO-friendly web applications using Next.js, leveraging its features for Routing, Client-Side Rendering, Server-Side Rendering, Static Site Generation, and Data Fetching.
• Leverage Generative AI throughout your learning and development process for accelerated learning, debugging (understanding and fixing errors, code explanation), generating code, optimising queries, and building/testing applications more efficiently.
• Get extensive hands-on experience by designing and implementing numerous practical projects, including a Tourism website, Food Munch responsive site, Ecommerce websites, Wikipedia search application, Twitter-like social networking platform, and Capstone Projects like a Netflix clone and Swiggy clone.
• Acquire industry-relevant skills and readiness, including setting up and using professional developer tools like VS Code and Chrome DevTools, understanding Operating System (OS) and Network essentials, and learning project deployment practices.

Who should take the Intensive Course?

• Individuals looking to build a strong foundation in web development:
  The curriculum starts with fundamental front-end technologies like HTML, CSS, and Bootstrap, enabling participants to create and publish simple, beautiful, and responsive static websites from scratch.
• Aspiring programmers new to the field:
  The "Programming Foundations with Python" module teaches fundamental concepts, including operators, data types, variables, conditional statements, loops, functions, and Object-Oriented Programming principles, building confidence in coding.
• Those aiming to become Full Stack Developers:
  The "MERN Full Stack" section specifically targets individuals seeking to master the MERN Stack (MongoDB, Express.js, React.js, Node.js) to architect end-to-end web applications and build a project portfolio.
• Individuals interested in Database Management and SQL:
  The course provides strong fundamentals in Databases and DBMS, allowing users to perform powerful queries on relational databases using SQL (CREATE, INSERT, SELECT, UPDATE, DELETE) and advanced concepts like Joins, Subqueries, Indexes, and Views.
• Developers wanting to work with NoSQL Databases:
  It includes a deep dive into MongoDB, covering CRUD operations, querying documents, aggregations, and integration with Node.js using Mongoose.
• Web Developers looking to build dynamic and interactive web applications:
  The JavaScript modules cover fundamental concepts, DOM manipulation, forms, array methods, events, Fetch API for HTTP requests, and advanced asynchronous JavaScript (Async/Await, Promises).
• Those interested in modern JavaScript frameworks for Front-End Development:
  The React JS section teaches how to build stateful web applications, covering JSX, components, props, state management with `useState()`, `useEffect()`, routing, authentication using JWT tokens, and global state management with React Context.
• Back-end Developers and those wanting to build robust APIs:
  The Node.js and Express.js modules teach how to build back-end web applications, handle HTTP requests, perform CRUD operations, manage errors, and secure RESTful APIs using JSON Web Tokens (JWT).
• Developers aiming for performant and SEO-friendly web applications:
  The Next.js module focuses on Server-Side Rendering, Static Site Generation, Routing, Client and Server Components, Data Fetching, and Authentication using Auth.js.
• Individuals who want to leverage Artificial Intelligence for Learning and Development:
  Generative AI is integrated throughout the curriculum for accelerated learning, debugging (understanding and fixing errors, code explanation), generating code, and concept-wise interview preparation.
• Jobseekers and career changers looking for practical experience:
  The course emphasises extensive hands-on experience through practical projects like a Tourism website, Food Munch responsive site, Ecommerce websites, Wikipedia search application, and Capstone Projects such as a Movies App (Netflix Clone) and a Tasty Kitchens Restaurant App (Swiggy Clone).

Curriculum

Level 1: Fundamentals of Web Development and Programming

• HTML, CSS and Bootstrap for Web Design:
  • Build Your Own Static Website: Learn to build a strong foundation in web technologies like HTML and CSS to create and publish simple, beautiful websites from scratch.
  • HTML Basics: Getting Started, Elements, Headings, Paragraphs, Buttons, Attributes, Images, Hyperlinks, Containers, Lists.
  • CSS Basics: Rulesets, Properties, Colours, Units, Box Model, Margins, Paddings, Borders.
  • Generative AI Integration: Leveraging GenAI for accelerated learning, debugging (understanding/fixing errors, code explanation), and generating code.
  • Course Project: Build a Tourism website using HTML5, CSS3, and Bootstrap.
• Build Your Own Responsive Website: Develop skills in HTML, CSS, and Bootstrap to create web applications that run smoothly across desktop, tablet, and mobile devices.
  • Intermediate CSS: Block vs inline elements, CSS Selectors (Class, ID, Type, Specificity, Inheritance, Cascading).
  • Bootstrap Components: Grid System (Container, Row, Column), Utilities (Display, Flex, Sizing, Spacing, Colours), Components (Navbar, Buttons).
  • Generative AI Integration: Leveraging GenAI for accelerated learning, debugging, and building responsive websites.
  • Course Project: Build a responsive Food Munch website using HTML5, CSS3, and Bootstrap Grid System.
  • Course Project: Build a responsive Ecommerce website using HTML5, CSS3, and Bootstrap Grid System.
• Modern Responsive Web Design:
  • CSS Layouting: Flexbox (Display, Flex-direction, Justify-content, Align-items, Flex-wrap, Flex-row, Align-content, Align-self, Flex-grow, Flex-shrink, Order), Sizing Elements, Overflow, Box Sizing, Content Box, Border Box.
  • CSS Media Queries: Media Query, Media Types, Media Features (Width, Height, Orientation), combining multiple Media Queries with Logical Operators (and, not).
  • CSS Grid: Grid Layout (Container, Items, fr Unit, repeat(), grid-template-columns, grid-template-rows, grid-template-areas, grid-area, justify-content, align-content, place-content, Media Queries, auto-fit and minmax()).
  • Generative AI Integration: Leveraging GenAI for accelerated learning, debugging, and building responsive websites.
• Tailwind CSS: Introduction to Tailwind CSS, Advantages, Setting up, Common Utility Classes, Display and Responsive Utilities (flex-row, flex-col, justify-center, Grid Utilities, Responsive Utilities).
• Programming Foundations with Python: Learn fundamental concepts of programming and gain confidence in Python, including writing programs, using data structures, and building modular software with Object-Oriented Programming principles.
  • Fundamentals of Programming: Operators, Data Types and Variables, Strings and Numbers, Conditional Statements.
  • Loops and Functions: Loops, String Methods, Functions, Recursion.
  • Data Structures: Lists, Tuples, Sets, Dictionaries.
  • Object-Oriented Programming: Classes and Objects, Attributes and Methods, Encapsulation, Inheritance, Abstraction, Polymorphism.
  • Working with Python Standard Library: Collections, Random, Datetime, Math.
  • Generative AI Integration: Maximise learning with AI, Code Explanation, Code Generation, Quiz Generation, Coding Problem Generation, Concept-Wise Interview Preparation.
• Introduction to Databases: Develop strong fundamentals in Databases and DBMS, and perform powerful queries on relational databases using SQL.
  • Relational Databases: Introduction to SQL, Database Design, ACID Properties.
  • SQL Operations: CREATE, INSERT, SELECT, UPDATE, DELETE.
  • Advanced SQL Modeling: ER Model, Creating a Relational Database.
  • Advanced SQL: Joins, Subqueries, Indexes, Views.
  • GenAI for SQL Development: Translating business requirements to SQL with AI, Debugging with AI Assistance, Query Optimization with AI Assistance.
• MySQL: Develop strong fundamentals in MySQL and perform powerful queries on databases using SQL.
  • Introduction to MySQL: Introduction to MySQL, Learning Databases, Introduction to MySQL Workbench.
  • SQL Operations: CREATE, INSERT, SELECT, UPDATE, DELETE.
  • Advanced MySQL features: Functions, Stored Procedures, Triggers, Views.
  • Introduction to MySQL Administration: User and Privilege Management, Core Database Administration Tasks.
• Developer Foundations: Learn essentials of Operating Systems, Networks, and essential developer tools like Command-Line.
  • Introduction to OS and Networks: Overview of OS Concepts, Networks and Internet, Network Layer, Application Layer, Web Servers.
  • Working with Command-Line: Files and File System, Managing System Packages, Environment Variables, Network.

Level 2: Dynamic Web Applications - Front-end Development

• Build Your Own Dynamic Web Application (JavaScript Fundamentals): Understand fundamental concepts in JavaScript and apply them to build dynamic and interactive web applications.
  • Introduction to JavaScript: Data Types, Variables, Basic Operators, Conditionals, Loops, Functions, Arrays, Objects, Control Flow, Comments, Math Function.
  • DOM Manipulation: The JavaScript Console, Introduction to the DOM, Select and Manipulate, Important Selector Methods, Manipulating Style/Text/Content/Attributes, Local Storage.
  • Forms: The form element, label, input, option, button, select, textarea elements, form validations and input.
  • Array Methods: Push, unshift, splice, pop, shift, find, indexOf, concat.
  • Events, Fetch and Callbacks: How to add Event Listeners, Callbacks, Schedulers (setTimeout, clearTimeout, setInterval, clearInterval), HTTP, HTTP Requests using Fetch, HTTP Responses, Working with JSON data.
  • Generative AI Integration: Leveraging GenAI for accelerated learning, debugging (understanding/fixing errors, code explanation, generating code), building dynamic web applications, and testing.
  • Course Project: Build a Wikipedia Search Application using HTML5, CSS3, JS.
• JavaScript Essentials (Advanced JS): Learn concepts like Events, Scope, Hoisting, `this`, ES6 Classes, Error handling, Objects, and Asynchronous JavaScript.
  • Rest parameters and spread syntax, Destructuring Arrays and Objects.
  • `this` keyword: in methods, window scope, function declarations, events.
  • JS Classes: Built-in Constructor Functions, Constructor Property, Inheritance, `this` in classes.
  • Asynchronous JS: Async/Await, Promises.
  • Array Methods: map, filter, reduce.
  • String Manipulations: trim and split, toUpperCase and toLowerCase, includes Methods.
  • Generative AI Integration: Role of GenAI in learning, enhanced learning (prompts), understanding/fixing errors, code explanation, generating code.
• React JS: Learn to build stateful web applications with ReactJS library from from scratch.
  • Introduction to React JS: Why React?, JSX, Rendering Elements, Components and Props, Function Components.
  • Conditional Rendering and Lists, Forms.
  • State Hook (`useState()`), Handling Events.
  • Effect Hook (`useEffect()`), Component LifeCycle.
  • Routing: `useParams()`, `useNavigate()`, Navigate Component.
  • Authentication and Authorization: Client and Server Communication, Authentication using JWT Token, Protected Route.
  • React Context: `use()`, Provider Component.
  • Generative AI Integration: Building React Applications, Testing and Debugging the Application.
  • Course Project: Build an Ecommerce application using ReactJS.

Level 3: Back-end Development and NoSQL Databases

• Node JS: Learn to build a back-end web application using Express, covering database integration, routing, and APIs.
  • Introduction to NodeJS: Node REPL, Modules, NPM CLI, Usage of NPM Packages.
  • Introduction to Express Web Application Framework: HTTP Server, Routes, Handling HTTP Request, Preparing HTTP Response.
  • Fundamentals of Application Building in Express: Integration with Database, CRUD Operations, Error Handling, Middleware.
  • Securing APIs: JSON Web Token (JWT), Authentication vs Authorization, Building a Secure Web API with Express.
  • Generative AI Integration: Leveraging GenAI for Building Back-end Application, Testing and Debugging.
  • Course Project: Build a REST web application, a Social Networking platform similar to Twitter using ExpressJS.
• MongoDB: Dive into MongoDB, a leading NoSQL database, building strong foundation and proficiency in concepts related to MongoDB.
  • Non-Relational Databases (MongoDB): Introduction to MongoDB, CRUD operations, Querying Documents, Aggregations, Nested Documents.
  • MongoDB integration with NodeJS: MongoDB Atlas, Mongoose, CRUD APIs with MongoDB, Testing MongoDB-backed APIs using Postman.

Level 4: Advanced Frameworks and Capstone Projects

• Next.js: Learn Next.js for Server-Side Rendering, Static Site Generation, and easy API Routing, mastering features like Routing, Data Fetching, and Authentication.
  • Introduction to Next.js: Why Next.js, Advantages, Setting up a Next.js Project, Folder Structure.
  • Routing and Components: App Router vs Pages Router, Creating Dynamic Routes, ` `, `useRouter()`, Client and Server Components, `use client` Directive.
  • Rendering Strategies and Data Fetching: Client-Side Rendering, Server-Side Rendering, Data Fetching, loading.tsx, error.tsx.
  • Authentication and API Routes: Authentication using Auth.js, Setting up Google OAuth, Creating API Routes.
• Capstone Projects:
  • Movies App (Netflix Clone): Build a Movies App where users can log in, view account details, browse movies (including trending), and view movie details. Tools used: HTML, CSS, JS, ReactJS.
  • Tasty Kitchens (Swiggy Clone): Build a Tasty Kitchens Restaurant App where users can log in, select recipes, add them to their cart, and place orders. Tools used: HTML, CSS, JS, ReactJS.

Tools you will learn in the Intensive Course

• Foundational Programming and Software Development
  • Understand Basic Terminology, Asymptotic Notations, Time and Space Complexity Analysis.
  • Develop proficiency in software development fundamentals, including syntax, debugging, tweaking code, and understanding and fixing errors.
  • Learn to explain and generate code, and explain and generate queries.
  • Gain problem-solving skills.
• Operating Systems, Networks and Command-Line
  • Get an overview of OS Concepts.
  • Understand Networks and Internet, including the Network Layer, Application Layer, and Web Servers.
  • Work with Command-Line for files, file systems, managing system packages, environment variables, and network operations.
• Python Programming
  • Learn fundamentals of programming with Python, including Operators, Data Types and Variables, Strings and Numbers, Conditional Statements, Loops, String Methods, and Functions.
  • Master Recursion in Python.
  • Utilise Python's built-in data structures: Lists, Tuples, Sets, Dictionaries.
  • Apply Object-Oriented Programming (OOP) principles: Classes and Objects, Attributes and Methods, Encapsulation, Inheritance, Abstraction, Polymorphism.
  • Work with the Python Standard Library (Collections, Random, Datetime, Math).
  • Engage in Web Scraping using Python.
• HTML (HyperText Markup Language)
  • Understand HTML Basics: Getting Started, Elements, Headings, Paragraphs, Buttons, Attributes, Images, Hyperlinks, Containers, and Lists.
  • Build Static Websites.
• CSS (Cascading Style Sheets)
  • Master CSS Basics: Rulesets, Properties, Colours, Units, Box Model, Margins, Paddings, and Borders.
  • Understand Intermediate CSS: Block vs Inline Elements, CSS Selectors (Class, ID, Type), Specificity, Inheritance, and Cascading.
  • Learn CSS Layouting:
    • Flexbox: Display, Flex-direction, Justify-content, Align-items, Flex-wrap, Flex-row, Align-content, Align-self, Flex-grow, Flex-shrink, order.
    • Sizing Elements, Overflow, Box Sizing (Content Box, Border Box).
  • Implement CSS Media Queries for responsive design: Media Query, Media Types, Media Features (Width, min-width, max-width, Height, min-height, max-height, Orientation), and combining multiple Media Queries with Logical Operators (and, not).
  • Utilise CSS Grid for complex layouts: Grid Container, Grid Items, fr Unit, repeat(), grid-template-columns/rows/areas, grid-area, justify-content, align-content, place-content, Media Queries, auto-fit and minmax.
  • Build responsive web applications that run smoothly across all devices.
• Bootstrap and Tailwind CSS
  • Implement Bootstrap Components: Carousel, Embedding Videos, Navbar, Buttons.
  • Utilise the Bootstrap Grid System: Container, Row, Column.
  • Apply Bootstrap Utilities: Display, Flex, Sizing, Spacing, Colours.
  • Set up and use Tailwind CSS, understanding its advantages, common utility classes, and responsive utilities (flex-row, flex-col, justify-center, Grid Utilities, sm, md, lg, xl).
• JavaScript
  • Learn Introduction to JavaScript: Data Types, Variables, Basic Operators, Conditionals, Loops, Functions, Arrays, Objects, Control Flow, Comments, and Math Functions.
  • Perform DOM Manipulation: Using the JavaScript Console, selecting and manipulating elements, changing styles, text, content, and attributes, and utilising Local Storage.
  • Handle Forms: Elements like form, label, input, option, button, select, textarea, and form validations.
  • Master Array Methods: Push, unshift, splice, pop, shift, find, indexOf, concat, map, filter, and reduce.
  • Work with Events: Adding Event Listeners, Callbacks, and Schedulers (setTimeout, clearTimeout, setInterval, clearInterval).
  • Understand HTTP: Hypertext Transfer Protocol, HTTP Requests using Fetch, HTTP Responses, and working with JSON data.
  • Utilise ES6+ features: Rest parameters and spread Syntax, Destructuring Arrays and Objects.
  • Grasp the concept of `this` in various contexts: methods, window scope, function declarations, events, and classes.
  • Implement JS Classes: Built-in Constructor Functions, Constructor Property, and Inheritance.
  • Handle Asynchronous JS: Async/Await and Promises.
  • Perform String Manipulation: trim and split, toUpperCase and toLowerCase, and includes() methods.
• React JS
  • Build stateful web applications with ReactJS.
  • Understand Introduction to React JS: Why React?, JSX, Rendering Elements, Components and Props, Function Components.
  • Implement Conditional Rendering and Lists: Conditional Rendering, Lists and Keys.
  • Work with Forms in React.
  • Utilise State Hook (useState()) and Effect Hook (useEffect()).
  • Manage Component LifeCycle.
  • Handle Events in React.
  • Implement Routing: useParams(), useNavigate(), and Navigate Component
  • Manage Authentication and Authorization: Client & Server Communication, Authentication using JWT Token, and Protected Routes.
  • Use React Context: use(), Provider Component.
• Node.js and Express.js
  • Build back-end web applications using Node.js and Express.js.
  • Understand Introduction to NodeJS: Node REPL, Modules, NPM CLI, and usage of NPM Packages.
  • Work with HTTP Server and define Routes.
  • Handle HTTP Requests and prepare HTTP Responses.
  • Integrate with Databases.
  • Perform CRUD Operations.
  • Implement Error Handling and Middleware.
  • Secure APIs using JSON Web Token (JWT), understanding Authentication vs Authorization.
  • Work with File Systems and Streams.
  • Deploy applications on external platforms.
• Databases (SQL and NoSQL)
  • Understand Fundamentals of Databases and DBMS.
  • Master Relational Databases Concepts: Introduction to SQL, Database Design, ACID Properties, ER Model, and Creating a Relational Database.
  • Perform powerful queries on databases using SQL Operations: CREATE, INSERT, SELECT, UPDATE, DELETE.
  • Apply Advanced SQL: Joins, Subqueries, Indexes, Views.
  • Learn MySQL: Introduction to MySQL, MySQL Workbench, Advanced MySQL features (Functions, Stored Procedures, Triggers, Views), and MySQL Administration (User and Privilege Management, Core Database Administration Tasks).
  • Dive into MongoDB (NoSQL): Introduction to MongoDB, CRUD operations, Querying Documents, Aggregations, Nested Documents.
  • Integrate MongoDB with NodeJS using Mongoose.
  • Test MongoDB-backed APIs using Postman.
• Next.js
  • Learn why Next.js is used and its advantages.
  • Set up a Next.js project and understand its folder structure.
  • Master Routing and Components: App Router vs Pages Router, creating dynamic routes, `<link>`, `useRouter()`, Client and Server Components, and `use client` Directive.
  • Understand Rendering Strategies and Data Fetching: Client-Side Rendering, Server-Side Rendering, Data Fetching, `loading.tsx`, `error.tsx`.
  • Implement Authentication and API Routes: Authentication using Auth.js, setting up Google OAuth, and creating API Routes.
• Generative AI for Web Development
  • Get an Introduction to GenAI in Web Development.
  • Leverage Gen AI for accelerated learning and enhanced learning through prompts.
  • Utilise GenAI for debugging: Understanding Errors, Fixing Code with Errors, Code Explanation, and Generating Code.
  • Maximise your learning with AI.
  • Prepare for interviews and generate quizzes and coding problems with AI.
  • Leverage GenAI for SQL Development: Translating business requirements to SQL, Debugging with AI Assistance, and Query Optimization.
  • Build dynamic web applications, responsive websites, React applications, and back-end applications using GenAI.
  • Test and debug applications with GenAI assistance.
• Industry Readiness and Tools
  • Set up VS Code.
  • Utilise Chrome DevTools for debugging and inspection.
  • Work with Online Code Editors and Online Coding Platforms.
  • Use design tools like Framer and Figma.
  • Set up a local database server.
  • Query databases in VS Code.
  • Use Postman for testing MongoDB-backed APIs.
  • Deploy projects on platforms like Vercel and other external platforms.
  • Learn about JavaScript frameworks like Three.js.
  • Understand MySQL Workbench for Database Management.
  • Utilise MongoDB Atlas.
  • Work with Auth.js for authentication.