Practice Web Development Programming Projects

Languages

🇨🇳 简体中文 🇯🇵 日本語 🇪🇸 Español 🇫🇷 Français 🇩🇪 Deutsch 🇷🇺 Русский 🇰🇷 한국어 🇧🇷 Português 🇺🇸 English

Web development is a dynamic and crucial field in the digital era. This skill tree offers a systematic way to learn front - end and back - end technologies. Tailored for beginners, it provides a clear roadmap to master HTML, CSS, JavaScript, and popular frameworks. Through hands - on, non - video courses and practical coding exercises, you'll build real websites and web applications in an interactive environment.

Exercises

Index	Name	Difficulty	Practice
001	Build an VSCode Extension With ChatGPT	Beginner	🚀 Start Lab
002	Build a Tic-Tac-Toe Web App	Beginner	🚀 Start Lab
003	Creating a Whack-a-Mole Web Game	Beginner	🚀 Start Lab
004	Create a Notes App Using React	Beginner	🚀 Start Lab
005	Building a Modern Expense Splitter Web App	Beginner	🚀 Start Lab
006	Creating a Drawing Board Web App	Beginner	🚀 Start Lab
007	Creating a Task Timer Web App	Beginner	🚀 Start Lab
008	Create a Swiper Carousel Web App	Beginner	🚀 Start Lab
009	Monty Hall Simulation Web App	Beginner	🚀 Start Lab
010	Building a Web Avoiding Block Game	Intermediate	🚀 Start Lab
011	2048 Web Game Using jQuery	Beginner	🚀 Start Lab
012	Developing a Simple Online Chat Room Using Flask	Beginner	🚀 Start Lab
013	Build a Sliding Puzzle Game With JavaScript	Beginner	🚀 Start Lab
014	Create a Pixel Art Animator With React	Beginner	🚀 Start Lab
015	jQuery Flip Puzzle Game	Beginner	🚀 Start Lab
016	Creating a Minesweeper Game With JavaScript	Beginner	🚀 Start Lab
017	Build a Simple Markdown Editor With Live Preview	Beginner	🚀 Start Lab
018	Implement a Magnifying Glass Effect Using Canvas	Beginner	🚀 Start Lab
019	Build an Image Cropping Tool Using HTML5	Beginner	🚀 Start Lab
020	Building a Christmas Wish List Builder in React	Intermediate	🚀 Start Lab
021	Building a React Drag-and-Drop Puzzle Game	Beginner	🚀 Start Lab
022	Building a React GitHub Heatmap Contributions	Intermediate	🚀 Start Lab
023	Deploying MobileNet With TensorFlow.js and Flask	Beginner	🚀 Start Lab
024	Don't Step on the White Tile	Beginner	🚀 Start Lab
025	Build a Scratch Card Web Game	Beginner	🚀 Start Lab
026	Build a Simple URL Shortener With Flask and MySQL	Advanced	🚀 Start Lab
027	Build a Web Based TCP Port Scanner	Beginner	🚀 Start Lab
028	Real-Time Sentence Search with Vue.js	Beginner	🚀 Start Lab
029	Vue.js Search Functionality Development	Beginner	🚀 Start Lab
030	Implement Dynamic Sticky Tab Bar	Beginner	🚀 Start Lab
031	CSS Fan-Like Hover Animation Effect	Beginner	🚀 Start Lab
032	The Boundless Sea of Learning	Beginner	🚀 Start Lab
033	A Good Review for the Takeout	Beginner	🚀 Start Lab
034	Address Management Web Application	Beginner	🚀 Start Lab
035	Bing Dwen Dwen Mood Scale	Beginner	🚀 Start Lab
036	Building a Traffic Lights System with JavaScript	Intermediate	🚀 Start Lab
037	Building a Simple Search Functionality	Beginner	🚀 Start Lab
038	Pagination Implementation with Axios	Beginner	🚀 Start Lab
039	Escape From the Dual Vector Foil	Beginner	🚀 Start Lab
040	Build a Guess the Coin Game	Beginner	🚀 Start Lab
041	Random Greeting Card Generator	Beginner	🚀 Start Lab
042	Movie Ticket Reservation System	Beginner	🚀 Start Lab
043	Axios-Driven Incantation Treasure Hunt	Beginner	🚀 Start Lab
044	Create Responsive Modal Boxes	Beginner	🚀 Start Lab
045	Building Reusable Pagination Component	Beginner	🚀 Start Lab
046	Spell Out a Future	Beginner	🚀 Start Lab
047	Web-based HTML Presentation Builder	Beginner	🚀 Start Lab
048	Custom Form Validation with Vue.js	Beginner	🚀 Start Lab
049	Empty pathMatch for Correct Path Calculation	Beginner	🚀 Start Lab
050	Vue.js Shopping Cart with Drag and Drop	Beginner	🚀 Start Lab
051	Implement Search Suggestions with Vue.js	Beginner	🚀 Start Lab
052	Product List with Layout Switching	Beginner	🚀 Start Lab
053	Vue.js Buttons and Value Updating	Beginner	🚀 Start Lab
054	Building Dynamic Menu Tree Search with Vue.js	Beginner	🚀 Start Lab
055	Fixing Vue Router's cleanPath Function	Beginner	🚀 Start Lab
056	Build a Vue.js E-book Reader	Beginner	🚀 Start Lab
057	Retrieving Object Parameters From Query	Beginner	🚀 Start Lab
058	Building a Vue.js Shopping Cart	Beginner	🚀 Start Lab
059	Building a Vue.js Store Status Switcher	Beginner	🚀 Start Lab
060	Implement Efficient Virtual Scrolling with Vue.js	Beginner	🚀 Start Lab
061	Implement Atomic Flex Layout with CSS	Beginner	🚀 Start Lab
062	Building a Responsive News Website Homepage	Beginner	🚀 Start Lab
063	Creative Billboard Design with Wooden Textures	Beginner	🚀 Start Lab
064	Depth of Field in Images	Beginner	🚀 Start Lab
065	Creating a Koala Face with CSS Grid	Beginner	🚀 Start Lab
066	Creating Earth's Orbital Animation with CSS	Beginner	🚀 Start Lab
067	Fixing Website Display Issues	Beginner	🚀 Start Lab
068	Responsive Dice Layout with Flexbox	Beginner	🚀 Start Lab
069	Responsive Flexible Card Layout	Beginner	🚀 Start Lab
070	Flexbox Vegetable Layout Design	Beginner	🚀 Start Lab
071	Fruit Arrangement with CSS Flexbox	Beginner	🚀 Start Lab
072	Visually Appealing Fruit Platter	Beginner	🚀 Start Lab
073	Give Your Page a Makeover	Beginner	🚀 Start Lab
074	Simple and Beautiful Home Page Design	Beginner	🚀 Start Lab
075	Movie Theater Seat Arrangement	Beginner	🚀 Start Lab
076	Responsive Web Design with Gulp	Beginner	🚀 Start Lab
077	Responsive Web Design for All Screens	Beginner	🚀 Start Lab
078	Create Visually Appealing Business Card	Beginner	🚀 Start Lab
079	Westward Journey to Heavenly West	Beginner	🚀 Start Lab
080	Data Formatting and Visualization with Vue.js	Beginner	🚀 Start Lab
081	Vanished Into Thin Air	Beginner	🚀 Start Lab
082	Wish Sticky Note App with Vue.js	Beginner	🚀 Start Lab
083	Responsive Navigation with Custom React Hook	Intermediate	🚀 Start Lab
084	React Theme Switcher Application	Intermediate	🚀 Start Lab
085	React Colour Filter Application	Intermediate	🚀 Start Lab
086	Implementing React Navigation Features	Intermediate	🚀 Start Lab
087	Create Responsive Business Card with React	Intermediate	🚀 Start Lab
088	Build Interactive React Components	Beginner	🚀 Start Lab
089	Switch Between Light and Dark	Beginner	🚀 Start Lab
090	Mobile Phone Number Verification	Beginner	🚀 Start Lab
091	Correctly Warn Incorrect v-Slot Usage	Beginner	🚀 Start Lab
092	Adding Deprecation Warning to Vue Router	Beginner	🚀 Start Lab
093	Dynamization of Homepage Data	Beginner	🚀 Start Lab
094	Fix the Test in async.spec.js	Beginner	🚀 Start Lab
095	Data Visualization with Echarts and JSON	Beginner	🚀 Start Lab
096	Handling Null Values Correctly	Beginner	🚀 Start Lab
097	Let’s Have a Meeting Together	Beginner	🚀 Start Lab
098	Building Login with Vue.js and Vuex	Beginner	🚀 Start Lab
099	Remove the Warning Generated by pathMatch	Beginner	🚀 Start Lab
100	Revisit Route Triggers Too Early	Beginner	🚀 Start Lab
101	Router Query Value Changed	Beginner	🚀 Start Lab
102	Building Flexible Skeleton Screens	Beginner	🚀 Start Lab
103	Time Conversion Tool with Vue.js	Beginner	🚀 Start Lab
104	Build a Vue.js Task Manager	Beginner	🚀 Start Lab
105	Interactive Film Collection Web App	Beginner	🚀 Start Lab
106	Building Responsive Accordion Interfaces	Beginner	🚀 Start Lab
107	Fruit Matching Game with HTML, CSS, JavaScript	Intermediate	🚀 Start Lab
108	Fruit Stacking Game with HTML, CSS, JavaScript	Intermediate	🚀 Start Lab
109	Implement User Login Function	Beginner	🚀 Start Lab
110	Simple Prize Draw Application	Intermediate	🚀 Start Lab
111	Building a Voting Application	Intermediate	🚀 Start Lab
112	Weekly Weather Forecast Application Development	Beginner	🚀 Start Lab
113	Hard Work Pays Off	Beginner	🚀 Start Lab
114	Real-Time Sales Dashboard with Echarts	Intermediate	🚀 Start Lab
115	Creating Interactive Bar Charts with ECharts	Beginner	🚀 Start Lab
116	Time With Your Phone	Beginner	🚀 Start Lab
117	Weather Trend Chart with Vue and Echarts	Beginner	🚀 Start Lab
118	Counting Access Times by IP	Beginner	🚀 Start Lab
119	Course Schedule CRUD With MyBatis	Beginner	🚀 Start Lab
120	Configuring Logging and Batch Aliasing in MyBatis	Beginner	🚀 Start Lab
121	Extending Entity with Custom Properties	Beginner	🚀 Start Lab
122	Implementation of AJAX Requests Using JS	Beginner	🚀 Start Lab
123	JSON Data Transfer With AJAX	Beginner	🚀 Start Lab
124	Logging Project Information With Log4j2	Beginner	🚀 Start Lab
125	Operate the Course Table	Beginner	🚀 Start Lab
126	Practical Use of resultMap	Beginner	🚀 Start Lab
127	User Permission Management System with JavaScript	Beginner	🚀 Start Lab
128	Promisifying Callback-based Asynchronous Functions	Beginner	🚀 Start Lab
129	Building a News API with Node.js	Beginner	🚀 Start Lab
130	Building a User Management RESTful API with Node.js	Beginner	🚀 Start Lab
131	Building a Node.js Reverse Proxy	Beginner	🚀 Start Lab

More

• 🔗 Web Development Learn more about
• 🔗 Awesome Programming Projects
• 🔗 Awesome Programming Courses