Modern Web Application Using Generative AI

Starting Date: 3rd December, 2023

Why choose the course?

Are you ready to embark on an exhilarating journey from a beginner to a master of modern app development and Generative AI? Join us in this transformative course where you'll not only learn to build full-stack applications using MongoDB, Node.js, and React.js with TypeScript but also harness the power of Generative AI to create intelligent and dynamic app features. Become an AI Hero and bring innovation to your app projects! Each of the 20 classes combines a 2-hour lecture with 2 hours of hands-on lab work, ensuring you gain practical expertise along the way.

The course culminates in an exciting capstone project where you'll create a full-stack Small Hospital Management Tool incorporating Generative AI for efficient visitor management, administrative task automation, financial tracking, and scheduling. Beyond mastery in technology, this course empowers you to launch startups, turning your innovative ideas into reality.

As an AI Hero, you'll be well-prepared to pursue opportunities in tech companies or freelance work, showcasing your ability to build sophisticated, real-world applications that meet industry standards or even take the entrepreneurial path and create your own startup. Get ready to become an AI Hero in the world of technology!

BDT 9550tk

Course content

6 sections • 20 lectures + bonus lectures • 80+ hours total length

Class 1: Introduction to Web Development Fundamentals

• Welcome to the journey of becoming an AI Hero
• Understanding the core principles of web development
• Setting up your development environment for success

Lab 1: Your First Web Page - HTML and CSS

• Create a simple webpage using HTML and style it with CSS
• Begin your journey with Git by initializing a repository and making your first commit

Class 2: JavaScript and Typescript Essentials for Beginners

• Exploring the world of JavaScript and Typescript - data types, variables, and control structures
• Functions and event handling for dynamic web interactions

Lab 2: Adding Interactivity with JavaScript

• Enhance your webpage with interactive JavaScript features
• Dive deeper into Git by working with branches and merging changes

Class 3: Version Control and Collaboration with Git and GitHub

• The power of version control in software development
• Collaborating with teammates using Git and GitHub

Lab 3: Collaborative Git Workflows

• Collaborate with peers using Git and GitHub workflows
• Master the art of branching and merging in Git

Class 4: Introduction to React.js and TypeScript

• Unveiling the magic of React.js for building interactive user interfaces
• Leveraging TypeScript for type safety and enhanced development

Lab 4: Building Your First React Application

• Create your first React application
• Explore React components and JSX syntax

Class 5: State Management and Routing in React

• Managing component state and props
• Enabling seamless navigation with React Router

Lab 5: Dynamic User Interfaces with React

• Implement state management in your React app
• Integrate React Router for navigation

Class 6: Advanced React Techniques - Hooks and Context API

• Harness the power of React hooks for managing state
• Using Context API for global state management

Lab 6: Building Robust User Interfaces with React

• Implement advanced state management with hooks
• Create a context-based global state for your app

Class 7: Styling Your React App - CSS-in-JS and Styled Components

• Styling strategies with CSS-in-JS and Styled Components
• Creating visually captivating user interfaces

Lab 7: Designing Stunning UIs with Styled Components

• Elevate your app's visual appeal with CSS-in-JS and Styled Components
• Experiment with advanced styling techniques

Class 8: Introduction to Generative AI

• Discover the potential of Generative AI in modern applications
• Exploring AI models and tools, including ChatGPT

Lab 8: Generating Text with AI Models

• Implement AI-powered text generation in your project
• Experiment with ChatGPT for dynamic content creation

Class 9: Crafting Interactive User Experiences with AI

• Making AI responses interactive and engaging
• Personalizing user experiences with Generative AI

Lab 9: Enhancing User Interactions with AI

• Implement AI-driven interactions in your project
• Create personalized AI-powered user journeys

Class 10: Advanced Generative AI - Image Generation

• Unlocking the power of Generative AI for image creation
• Enhancing user experiences with AI-generated images

Lab 10: Incorporating AI-Generated Images into Your App

• Enrich your app with AI-generated images for enhanced visuals
• Experiment with image generation tools

Class 11: Setting Up a Node.js Server

• Initiating your Node.js server for backend development
• Building RESTful APIs with Express.js

Lab 11: Creating RESTful APIs with Express.js

• Develop API endpoints for your project's backend
• Implement CRUD operations with MongoDB

Class 12: User Authentication and Security Best Practices

• Implementing user authentication for secure applications
• Exploring best practices for backend security

Lab 12: Secure Your Application with User Authentication

• Implement user authentication for your project
• Apply security best practices to safeguard user data

Class 13: Advanced Backend Techniques - Middleware and Deployment

• Leveraging middleware for advanced functionality
• Preparing your backend for deployment

Lab 13: Integrating Middleware and Deployment in Your Backend

• Implement middleware for enhanced backend functionality
• Prepare your backend for deployment to the cloud

Class 14: Deployment Strategies and Best Practices

• Exploring deployment strategies for web applications
• Best practices for deploying your fullstack app

Lab 14: Deploying Your Fullstack Application

• Deploy your fullstack application to a cloud platform
• Configure deployment settings and monitor your app

Class 15-19: Capstone Project - Building Your Fullstack Hospital Management Software

• Apply all the knowledge and skills acquired in a real-world project
• Create a fullstack Hospital Management Software combining React.js, Generative AI, Node.js, and MongoDB
• Develop advanced features and implement best practices
• Develop advanced features and implement best practices
• Troubleshoot, optimize, and refine your application

Class 20: Capstone Project Showcase and Final Reflection

• Present your fullstack Hospital Management Software/ Capstone project to the class
• Celebrate your journey from Zero to AI Hero
• Demonstrate the power of Generative AI in fullstack development
• Reflect on your growth and future opportunities in the tech industry
• Certification

Details to know

Shareable Certificate

Capstone Industry Certification

Add your credential to LinkedIn, your resume, and your CV. Share it on social media and in your performance review to show off your skills and experience.