Если вы новичок в JavaScript, вам может быть сложно начать создавать что-либо. Такие вопросы, как «Хорошо, что я могу построить с помощью этого недавно приобретенного навыка?» возникают. И как новичок в JS, вы ДОЛЖНЫ практиковаться, нет двух способов.
В этой статье я расскажу вам, как стать крутым в JavaScript с помощью нескольких проектов, над которыми вы можете работать и практиковаться в качестве новичка. Помните, что вы можете просмотреть ссылки, если вам нужно руководство, или перейти на YouTube для более пояснительного видео.
1. Калькулятор JavaScript
Создание простого калькулятора с помощью JavaScript — это весело и здорово. Здесь вы можете улучшить свои навыки HTML и CSS и, конечно же, навыки JavaScript. Этот проект расширяет ваши представления о том, как работают функции JavaScript.
Чтобы создать калькулятор JavaScript, вам необходимо как минимум знать следующее:
- Операторы if/else
- Для циклов
- Функции JavaScript (как было сказано ранее)
- Стрелочные функции
- && и || операторы
- Слушатели событий
- Изменить текст с помощью свойства текстового содержимого
Если вам нужна небольшая помощь или руководство, ознакомьтесь с этой статьей: https://www.section.io/engineering-education/building-a-calculator-a-javascript-project-for-beginners/
2. JavaScript секундомер
Это еще один прекрасный проект, который вы должны попробовать как новичок. Секундомер JavaScript. Здесь вам понадобятся знания HTML, CSS и JAVASCRIPT, только основы.
Для этого проекта вам необходимо хорошо разбираться в следующих темах JavaScript:
- Функции JavaScript
- Операторы if/else
- Слушатели событий
- Методы и объекты JavaScript
Гид:
https://codepen.io/cathydutton/pen/xxpOOw
3. Ударная установка JavaScript
Это для любителей музыки Techies. Вы можете создать свою собственную ударную установку с помощью JS. Это просто и весело. Вы также можете играть на барабанах, используя клавиши на клавиатуре. Здесь вы прокачаете свои знания:
- Слушатели событий
- Функции JavaScript
- Добавление звуков в JavaScript
- Функции и переменные JavaScript
Гид:
4.JavaScript крестики-нолики
Тем, кто любил эту игру в детстве, предоставляется возможность создать живую, технологичную игру в крестики-нолики.
В этом проекте вы будете использовать HTML (входные данные), CSS (ваши знания о таблицах и макетах) и, конечно же, JS.
Его довольно легко разработать с помощью нескольких простых проверок и проверок ошибок. Игрок-1 начинает игру, и оба игрока делают ходы подряд. Игрок, составивший прямую цепочку из 3 блоков, побеждает в игре. Эта игра построена на внешнем интерфейсе, используя только простую логику и проверки.
Вам необходимы знания JS:
- Логика и операторы JS
- Операторы if/else
- Функции JavaScript
Гид:
5. Список дел JavaScript
Приложение JavaScript To-do довольно простое. Это как-то самое простое среди 5-ти упомянутых ранее. Знание:
- Нужны функции JavaScript
- Инкремент и декремент JavaScript
- Для циклов
- Слушатели событий
- Операторы if/else
Гид :
6. Проект лабиринта JavaScript
Это еще один замечательный проект для начинающих JavaScript. Лабиринт игра. Немного сложно, особенно с CSS и JS, но я доверяю тому, кто читает эту статью. Ты получил это!
Проект Maze Game разработан с использованием HTML5, CSS и JavaScript. Здесь игрок должен выбраться из лабиринта за заданное время; это 30 секунд, и движения выполняются с помощью элементов управления клавиатуры (клавиши со стрелками или клавиши W, A, S, D для движения). На каждом уровне есть разные лабиринты, которые генерируются случайным образом. Теперь, говоря об окружающей среде, дизайн игры установлен на Canvas. Во время игрового процесса всякий раз, когда игрок перемещается из одного места в другое, в качестве следов остаются цвета при наведении, и каждое движение засчитывается. Игрок может перемещать столько, сколько он хочет, но в течение короткого периода времени.
Для этого проекта вам необходимо знать:
- Функции JavaScript
- Операторы if/else
- JavaScript «это» ключевое слово
- Для петель
- Увеличение
- Слушатели событий
Гид
Игра «Лабиринт в HTML5, JavaScript с исходным кодом
Загрузить игру Лабиринт в HTML5, JavaScript с исходным кодом. Игра Canvas Maze на Html5, CSS, JavaScript с исходным кодом…code-projects.org»
7. Парная игра JavaScript
Программирование игры на сопоставление памяти на JavaScript или парной игры — еще один интересный проект, который вы можете создать для развлечения (и для своего портфолио!).
Логика игры проста:
- На столе лежит заданное количество карт лицевой стороной вниз.
- Игроку нужно найти все пары.
Однако вы можете добавить больше сложности, ограничив количество догадок или установив ограничение по времени для завершения игры.
Вам понадобятся некоторые знания:
- Массивы JavaScript
- Для циклов
- Увеличение
- Операторы If и Else
- Функции и переменные JavaScript.
Гид
8. Проект приложения погоды на JavaScript
Создание погодного приложения — отличная идея для проекта, если вы новичок в JavaScript и у вас пока не так много проектов в портфолио.
Этот проект научит вас, как извлекать данные из API и динамически отображать их на вашей веб-странице.
Вот пошаговое руководство по созданию приложения погоды на JavaScript от Dev Ed на YouTube.
Вот несколько простых идей для начинающих в JavaScript. Это проверит ваши навыки.
Конец Примечание:
Помните, просматривая руководство или видео, не копируйте и не вставляйте. Постарайтесь понять, чему вас учат или объясняют. Есть YouTube, если вам нужны подробные объяснения или если вы застряли в каком-то месте.
Не расстраивайтесь, если вы сначала не понимаете, каждый разработчик был там. Попробуйте тоже задавать вопросы. И не сдавайтесь, всегда тренируйтесь и тренируйтесь, пока у вас все не получится! Удачи.
