What to write for training on js from scratch?

Cameron asked 12 months ago


I am at the very beginning of the study of JS, with the theory more or less familiar. Advise – what to write for training? From the easiest to the hardest.

To date, I am already able to impose adaptively, I use BEM and the preprocessor, I understand the assembly. But I want to delve into the JS 🙂

Thank you all for the answers!

Anna replied 11 months ago

First decide your previous question.

7 Answers
Best Answer
Oliver answered 12 months ago

From what can often come in handy on the web

  • Parallax
  • slider
  • generating tables from js
  • sorting tables
  • communication with the server
  • Player (audio / video)
  • Work with time (momentjs)
  • Loading posts when scrolling
  • Movement of blocks at scrolling
  • Pagination
  • Modalka
  • Interaction with images (filter, cropping, …)
  • Custom selects, datapicks
  • Tabs

+ You can search for top sites and try to repeat interesting pieces of them.
+ jQuery
+ frameworks, for example Vue
+ node js

William answered 12 months ago

It depends on how much time you want to spend.
You can create a project from scratch. For example, a service for storing your own notes. Define the goals that the application will fulfill (create a note, delete, edit, search by category). You can write an API (welcome to node.js) if you want to save notes on the server. If you do not want to write an API, you can use other services that will enable you to do server work for you, you just need to “communicate” with them from the client side (for example, Google Firebase). If you do not want this, you can save notes locally in the browser (localStorage, IndexedDB). Creating a project, you will come across writing modalok, buttons, pagination, and a lot of other things that are useful in real work.
More options:
– An application for storing watched movies (and movies that you want to see. Impressions, personal evaluation)
– PWA application that copies the functionality of a mobile application (see Google Play, AppStore)
– API that will generate generated (fake) data (faker.js)
– WhatApp / Viber / Telegram / Facebook bot to send the current weather / exchange rate, etc.

You can write something that is useful to you. For example, a telegram bot, which would send you new movies that appeared on torrents. This is node.js.

You can write a game on canvas. You can not on canvas. Just JS + CSS.
More options:
– 2048
– Labyrinth where something moves somewhere
– Guess the number (the script “guesses” the number, you enter your own – it tells you, it is more or less and until you guess it)
– Any other using popular js engines for games (https://github.com/collections/javascript-game-engines)

You can rewrite some JS library (look at Github).
You can write your own library. Start small: let’s say it will generate random strings. Or first names, last names and emails.
More options:
– Text Editor
– Check passwords for stability
– Validation (passwords, names, phone names, emails) – hello, regular expressions
– Generate random pixels on canvas
– Library-helper: write your own functions-bicycles when working with data (parse json, clone an object, etc.)

There are a lot of options.
You can choose both a technology stack for writing something, or just an idea for a project, and on which technologies – to figure it out later, depending on what you need.

Matthew answered 12 months ago

Create a json file and generate some nice lazy tree from it. For example, in the beginning you have loaded a tree from 3 groups. By clicking on the group data is loaded. At this moment you are doing the animation of this action. Having received the data you finish the tree with new data. As api you can take json-server https://github.com/typicode/json-server

A bunch of implementation variations – from vinyl (pure) js to using the framework or libraries – (angular, react, vue).

Martin answered 12 months ago

1. Write a tic-tac-toe game.
2. Write the game “Arkanoid”.
3. Write the game “Sokoban”.

Bonus (as usual, but for lovers of the genre):

Command and Conquer is the grand-daddy of all Real Time Strategy games and is probably the game that made the genre popular.

James answered 12 months ago

Exercism.io to train the theory

Harry Booth answered 12 months ago

Personally, I would, if I didn’t write a project right from the start, but started with demos. Since there is still not enough knowledge at the initial stages to do right, and in fact you learn to write crutches. You can take learn.javascript.ru, complete tasks for articles, make your own small demo projects for each article (and ideas appear exactly during the study of these articles, as well as the questions to which you can get an answer by trying something in the same demos ). But then think about how to write something larger, to consolidate the material studied.

Emily answered 12 months ago

Write game sapper