All Projects → zero-to-mastery → coding_challenge-14

zero-to-mastery / coding_challenge-14

Licence: other
Understanding JavaScript and coding without the help of a library or tool

Projects that are alternatives of or similar to coding challenge-14

Vanilla Semantic Ui
Semantic UI component framework without jQuery
Stars: ✭ 97 (+340.91%)
Mutual labels:  vanilla-javascript, vanilla-js
Mailtoui
A simple way to enhance your mailto links with a convenient user interface.
Stars: ✭ 162 (+636.36%)
Mutual labels:  vanilla-javascript, vanilla-js
Router.js
Router.js is a simple and powerful javascript library to handle routing
Stars: ✭ 107 (+386.36%)
Mutual labels:  vanilla-javascript, vanilla-js
Fine Uploader
Multiple file upload plugin with image previews, drag and drop, progress bars. S3 and Azure support, image scaling, form support, chunking, resume, pause, and tons of other features.
Stars: ✭ 8,158 (+36981.82%)
Mutual labels:  vanilla-javascript, vanilla-js
extreme-carpaccio
Slicing and coding game
Stars: ✭ 116 (+427.27%)
Mutual labels:  challenge, coding-challenge
Bin
A tiny (<1kb) localStorage and sessionStorage helper library.
Stars: ✭ 70 (+218.18%)
Mutual labels:  vanilla-javascript, vanilla-js
Vanillajs Deck
A Vanilla.js Single Page App (SPA) slide deck for a presentation about Vanilla.js written with no frameworks.
Stars: ✭ 119 (+440.91%)
Mutual labels:  vanilla-javascript, vanilla-js
Bunny
BunnyJS - Lightweight native (vanilla) JavaScript (JS) and ECMAScript 6 (ES6) browser library, package of small stand-alone components without dependencies: FormData, upload, image preview, HTML5 validation, Autocomplete, Dropdown, Calendar, Datepicker, Ajax, Datatable, Pagination, URL, Template engine, Element positioning, smooth scrolling, routing, inversion of control and more. Simple syntax and architecture. Next generation jQuery and front-end framework. Documentation and examples available.
Stars: ✭ 473 (+2050%)
Mutual labels:  vanilla-javascript, vanilla-js
curved-menu
VanillaJS fully configurable curved menu (circular navigation)
Stars: ✭ 30 (+36.36%)
Mutual labels:  vanilla-javascript, vanilla-js
coding challenge-38
Bomberjam AI
Stars: ✭ 19 (-13.64%)
Mutual labels:  challenge, coding-challenge
Vanilla Ui Router
Simple vanilla JavaScript router
Stars: ✭ 42 (+90.91%)
Mutual labels:  vanilla-javascript, vanilla-js
Challenge Build Your Own Array In Js
This is a challenge that will allow you to practice your logical, analytical and problem-solving skills. Additionally, by the end of it you’ll have much better command of arrays in javascript.
Stars: ✭ 173 (+686.36%)
Mutual labels:  challenge, vanilla-js
Learn Vanilla Js
Open source list of paid & free resources to learn vanilla JavaScript
Stars: ✭ 945 (+4195.45%)
Mutual labels:  vanilla-javascript, vanilla-js
js-plugin-starter-kit
VanillaJS (pure JavaScript) plugin starter with Webpack 4 and Babel 7.
Stars: ✭ 100 (+354.55%)
Mutual labels:  vanilla-javascript, vanilla-js
Vanilla Lazyload
LazyLoad is a lightweight, flexible script that speeds up your website by deferring the loading of your below-the-fold images, backgrounds, videos, iframes and scripts to when they will enter the viewport. Written in plain "vanilla" JavaScript, it leverages IntersectionObserver, supports responsive images and enables native lazy loading.
Stars: ✭ 6,596 (+29881.82%)
Mutual labels:  vanilla-javascript, vanilla-js
Rallax.js
Dead simple parallax scrolling.
Stars: ✭ 1,441 (+6450%)
Mutual labels:  vanilla-javascript, vanilla-js
Vanilla Datatables
A lightweight, dependency-free javascript HTML table plugin
Stars: ✭ 314 (+1327.27%)
Mutual labels:  vanilla-javascript, vanilla-js
Darkmode Js
DarkModeJS helps you to auto detect user's time and switch theme to darkside
Stars: ✭ 328 (+1390.91%)
Mutual labels:  vanilla-javascript, vanilla-js
Bs Custom File Input
A little plugin for Bootstrap 4 custom file input
Stars: ✭ 162 (+636.36%)
Mutual labels:  vanilla-javascript, vanilla-js
Competitive-Programming-Codes
Includes codes from coding competitions and contests over the internet. Languages:- Python3 and C++
Stars: ✭ 14 (-36.36%)
Mutual labels:  challenge, coding-challenge

coding_challenge-14

This coding challenge is all about understanding javascript and coding without the help of a library or tool. It is very easy to get caught up in all of the trendy libraries and tools that allow you to build front end applications. However, by focusing on just a library, you are letting yourself be at the mercy of trends that constantly change. Instead, if you are able to understand the core concepts of javascript, then you aren't as influenced by trends and you can constantly adapt since the underlying language of the web doesn't change very often (these libraries are all written in Javascript afterall!) In this challenge, you are only allowed to use JavaScript to build a game!

Please Use the #coding-challenge channel on Discord to discuss and share your work. At the end of the challenge, I will compile everyone's submitted websites on here.

What is the Challenge?

Using this as an example (but don't copy the code or use jQuery): https://codepen.io/natewiley/pen/HBrbL, you have to build a matching game that has these features:

  • Time elapsed until you complete the game (all cards revealed)
  • Total Moves count before you complete the game
  • Reset button to start the game over

You can use whatever template you want, but I recommend using the Animal Emoji layout that we build in the The Complete Web Developer in 2019: Zero to Mastery course in the CSS Layout and CSS Grid Section

Optional:

  • High Score Leaderboard

This is how the game board should look like (but you can design it however you like):

matching game

In an upcoming challenge we are going to be doing something really interesting where we turn what you create here into a multiplayer game... but that will come later in a future coding challenge."

The Rules Are:

  1. Use only HTML, CSS and Javascript create a web based matching game as shown above. Think about code efficiency, and readability of your code.

  2. You have until February 28th at 11:59pm EST to submit your solution file (using Github. If you don't know how to do that, check out the lecture in the Git + Github section of the course). You will have to submit the link to the #coding-challenge Discord channel with the following message: "-challenge URL LINK TO YOUR ENTRY" The bot will listen for the command and will submit the link you provided in the command. Please check that the bot responded with "Thanks for submitting your coding challenge entry!" and then double check the details it provides. We will compile all submissions here at the end of the month.

  3. Use whatever tools you have as developers (google, friends, Discord, programming buddy etc...) but I will not be offering any help with this challenge. Just like a developer, you must solve a problem and build something that will be challenging. Nobody will hold your hand during the job so we want to experience that by figuring it all out on your own with your team.

*** Please note: As with all my challenges there is zero benefit or monetary gain I receive from it. This is just my way of thanking my students and making sure that you are able to continue gaining valuable knowledge outside of just my videos. It would mean a lot to me if you are able to rate my course...5 star reviews make my day :)

Coding Challenge Submissions

The wonderful submissions from some of the Zero-to-Mastery students on the foutreenth coding challenge will be posted here at the end of the month!

geelie#5864

roopabdr#4125

Jaroslav Huss#4614

Parca#4465

alex-kun#9405

sasot#1266

masci4#7646

Belnako#3185

Dmitri#5647

Sergei#1434

Donatron#4502

Maïeul#6749

Russellicious#4508

arudovwen#3427

pillinho_sk#5509

Mattchow#8280

The24thDS#6523

Ser#9716

Wolfgang#5359

DanielRT#4931

Dextrous#8737

Sniper73#8041

newchar#3140

oghenebrume#8411

carrn7k#8846

Major Kira#9300

thenab#7955

E.#8741

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].