Skip to content
/ practice-javascript-programming-projects Public

Build real JavaScript projects with 104 beginner-friendly challenges. Learn by doing with guided coding exercises and practical applications.

labex.io/learn/javascript
4 stars 0 forks Branches Tags Activity
Star
Notifications You must be signed in to change notification settings

labex-labs/practice-javascript-programming-projects

BranchesTags

Repository files navigation

Practice JavaScript Programming Projects

Languages

๐Ÿ‡จ๐Ÿ‡ณ ็ฎ€ไฝ“ไธญๆ–‡ ๐Ÿ‡ฏ๐Ÿ‡ต ๆ—ฅๆœฌ่ชž ๐Ÿ‡ช๐Ÿ‡ธ Espaรฑol ๐Ÿ‡ซ๐Ÿ‡ท Franรงais ๐Ÿ‡ฉ๐Ÿ‡ช Deutsch ๐Ÿ‡ท๐Ÿ‡บ ะ ัƒััะบะธะน ๐Ÿ‡ฐ๐Ÿ‡ท ํ•œ๊ตญ์–ด ๐Ÿ‡ง๐Ÿ‡ท Portuguรชs ๐Ÿ‡บ๐Ÿ‡ธ English

JavaScript is the programming language of the web. This Skill Tree offers a systematic way to learn JavaScript. Tailored for web development beginners, it provides a clear roadmap to grasp core concepts, DOM manipulation, and asynchronous programming. Hands - on, non - video courses and coding exercises in an interactive JS playground help you develop practical skills for creating dynamic web applications.

Exercises

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

More

About

Build real JavaScript projects with 104 beginner-friendly challenges. Learn by doing with guided coding exercises and practical applications.

labex.io/learn/javascript

Topics

javascript programming-language awesome web-development programming frontend scripting ecmascript projects awesome-list exercises coding-challenges web-technologies hands-on beginner-javascript javascript-tutorials js-learning interactive-web labex

Resources

Readme
Activity
Custom properties

Stars

4 stars

Watchers

2 watching

Forks

0 forks
Report repository

Releases

No releases published

Packages

No packages published