Introduction To Full Stack Web Development - Mini Project

Mini BootCamp 2023 Web Development [ Learn how to send a Data from Front End to Back End with a Small Course Project ]

What you'll learn

Ideas on Front End and Back end Full Stack Concepts including API Web Server & Database

Practical understanding of Full Stack Web Development

Course Project focuses on sending data from Front end to Backend

Identify and manage JSON data flow between Front and Back End

An Overview on Advanced Front End & Back End Frameworks & E-commerce CMS Sites

Frameworks and Tools employed in this Course: Express Js , MySQL , Simple HTML Form Page

Requirements

Some Basics of HTML, CSS, JavaScript, SQL Commands

Little Familiarity about Express Js, HTML form Page and MySQL Database

Description

As a Beginner friendly course, it has everything to get you started in Full Stack Web Development in 2023 with a mini Project!In this project based course, You will learn to understand, code and implement the data flow between front and back end. Specifically, the course project will teach you to send DATA from Front end to Back end . You can challenge to retrieve the Data back to the Front End .Simple Front End Design, Express JS framework and SQL Database has been employed to demonstrate the data flow between Front end browser Page and back end. This will provide you intuitive understanding of Full Stack development. Concepts you learn here will help you to understand any full stack architecture efficiently even when you work in other frameworks in the future. Chapter One gives ideas about Front End and Back end DB & Web Server.Furthermore, chapter One demonstrates the outline of the Full Stack Project . Chapter Two is all about Front End Design based on our project requirements. Form Page, POST and GET request has been utilized in the front end design. Chapter Three is Back End Design where you will learn how to design API web Server in Express JS and interact with SQL database and Front End.Chapter Four practically demonstrates the Full Stack project. Live Demo. Furthermore, it gives some ideas for you to practically implement this project either online or in local host along with GitHub code base for this project.Chapter Five talks about trending technology in 2023 AI web development, E- commerce sites and the future of Web development and provides some references to important web development official Resources.

Overview

Section 1: A brief introduction to Full Stack development & Course project outline

Lecture 1 Full Stack development explanation

Lecture 2 Course Project Outline

Lecture 3 Mind Map

Section 2: Front End Development – A simple form Submission Page

Lecture 4 Listing out Course Project Front End Route requirements & design requirements

Lecture 5 Course Project HTML Form Page [ Code Explanation ]

Section 3: Back End Development – Express Js API routes and SQL DB connection & queries

Lecture 6 OverView of Backend Development

Lecture 7 App.js API Setup & Development and Route 1 Get Request Development [ Code ]

Lecture 8 Route 2 Post Request Development with SQL connection & queries [ Code ]

Lecture 9 DataBase Setup Document

Section 4: Live Demonstration of Full Stack development Project

Lecture 10 Live Demonstration of Full Stack development Project

Section 5: Other popular Full Stacks and course project signficance

Lecture 11 Popular Full Stacks combinations

Lecture 12 Approaching other Full Stacks from the understanding of Course Project Dataflow

This course is for the beginners who is willing to become Full Web Developer in the Future,Grade 12th students are welcome to participate in the course,If you specifically want to learn the data flow from Front end to Back End in ExpressJs