Build a Brain Storming Memory Game with JavaScript, HTML, and CSS š„
Welcome, Flip, Match, and Win is a fun and challenging card memory game using HTML CSS & JAVASCRIPT that features a dynamic and interactive gameplay. With its CSS styles and flipping effect, it's an engaging game that will keep you entertained for hours. So, sharpen your memory skills and get ready to flip, match, and win!
š Video Source Code: https://www.thapatechnical.com/2023/0...
š Become Member, get access to perks, free Source code, & more..
Ā Ā Ā /Ā @thapatechnicalĀ Ā
š Check my Instagram to Connect with me: Ā Ā /Ā thapatechnicalĀ Ā
š©āš» Discord Server Link for Programmer to Hangout: Ā Ā /Ā discordĀ Ā
==========TIMELINE===========
0:00 - Introduction and explanation of the game
1:22 - Update on shuffling videos
3:50 - Overview of folder structure
4:20 - HTML code for the game
6:30 - Step 1: Creating a grid of cards with images on the back
9:45 - CSS styling for the grid
12:10 - Discussion and correction of mistakes made in the previous steps
16:20 - Step 2: Duplicating the grid to increase the number of cards
18:30 - Step 3: Randomizing the order of the cards
22:01 - Step 4: Adding a CSS class to show selected cards
27:10 - Step 5: Allowing only two cards to be selected per turn
29:05 - Step 6: Adding a CSS style to match the selected cards
38:01 - Step 7: Continuing the game until all matches are made
44:05 - Step 8: Adding a delay to show selected cards for a short period
45:35 - Step 9: Creating two sides for each card and styling them for a flipping effect
53:30 - Discussion of main changes needed for the game to work
55:40 - Review of the completed app.
************ š Must Watch Videos For Web Development š ************
ā”ļø Complete Reactjs in One video here Ā Ā Ā ā¢Ā ReactJSĀ ForĀ BeginnersĀ inĀ OneĀ VideoĀ in...Ā Ā
ā”ļø HTML in One Video: Ā Ā Ā ā¢Ā LearnĀ HTMLĀ inĀ OneĀ VideoĀ inĀ HindiĀ from...Ā Ā
ā”ļø CSS in One video: Ā Ā Ā ā¢Ā LearnĀ CompleteĀ CSSĀ InĀ OneĀ VideoĀ InĀ HindiĀ Ā
ā”ļø CSS FlexBox in 30 Minutes: Ā Ā Ā ā¢Ā CSSĀ FlexBoxĀ inĀ 30Ā MinutesĀ inĀ HindiĀ 2022Ā Ā
ā”ļø JavaScript in One video: Ā Ā Ā ā¢Ā JavaScriptĀ inĀ OneĀ VideoĀ inĀ HindiĀ Ā
ā”ļø ECMAScript 6 in One Video: Ā Ā Ā ā¢Ā ES5Ā &Ā ES6Ā |Ā ECMAScriptĀ 6Ā inĀ OneĀ Video...Ā Ā
ā”ļø HTML5 in one video: Ā Ā Ā ā¢Ā HTML5Ā TutorialĀ inĀ OneĀ VideoĀ inĀ HindiĀ ...Ā Ā
ā”ļø CSS3 in one video: Ā Ā Ā ā¢Ā LearnĀ CompleteĀ CSS3Ā InĀ OneĀ VideoĀ InĀ H...Ā Ā
ā”ļø Bootstrap4 in One video: Ā Ā Ā ā¢Ā BootstrapĀ 4Ā inĀ OneĀ VideoĀ inĀ HINDIĀ Ā 2019Ā Ā
ā”ļø Jquery in One video: Ā Ā Ā ā¢Ā jQueryĀ inĀ OneĀ VideoĀ inĀ HindiĀ 2019Ā Ā
ā”ļø JSON in one video: Ā Ā Ā ā¢Ā JSONĀ inĀ OneĀ VideoĀ inĀ HindiĀ 2018Ā Ā
ā”ļø ReactJS in one video: Ā Ā Ā ā¢Ā ReactJSĀ ForĀ BeginnersĀ inĀ OneĀ VideoĀ in...Ā Ā
ā”ļø PHP in One Video: Ā Ā Ā ā¢Ā PHPĀ TUTORIALĀ INĀ ONEĀ VIDEOĀ INĀ HINDIĀ 2019Ā Ā
ā”ļø NodeJS in one video: Ā Ā Ā /Ā ipnwakoibtĀ Ā
ā”ļø MySQL in one video: Ā Ā Ā ā¢Ā CompleteĀ SQLĀ &Ā MySQLĀ inĀ OneĀ VideoĀ inĀ ...Ā Ā
ā”ļø Advanced JavaScript in Hindi Playlist: Ā Ā Ā ā¢Ā AdvancedĀ JavaScriptĀ TutorialĀ inĀ Hindi...Ā Ā
ā”ļø ES5 & ES6 | ECMAScript 6 in One Video in Hindi: Ā Ā Ā ā¢Ā ES5Ā &Ā ES6Ā |Ā ECMAScriptĀ 6Ā inĀ OneĀ Video...Ā Ā
ā”ļø JavaScript Game Development Series in 2020: Ā Ā Ā ā¢Ā JavaScriptĀ GameĀ DevelopmentĀ HindiĀ 2020Ā Ā
Watch video Build a Brain Storming Memory Game with JavaScript, HTML, and CSS š„ online without registration, duration hours minute second in high quality. This video was added by user Thapa Technical 01 April 2023, don't forget to share it with your friends and acquaintances, it has been viewed on our site 17,495 once and liked it 397 people.