React JS Course by Andriy Bryla - Homework Repository
This repository contains all homework assignments from the React JS course by Andriy Bryla (2025).
Course Structure
Homework Assignments
| Lesson |
Description |
Technologies |
Demo |
| Lesson 1 |
JavaScript/React Tasks |
HTML5, CSS3, JS ES6+, React 18 |
:globe_with_meridians: View Demo |
| Lesson 2 |
Modern React Practice |
React 18, Vite, Modern Hooks |
:globe_with_meridians: View Demo |
| Lesson 3 |
React Hooks (useRef, useEffect) |
React 19, Vite, Tailwind CSS 4.1 |
:globe_with_meridians: View Demo |
| Lesson 4 |
Components Practice |
React 19, Vite, Tailwind CSS |
:globe_with_meridians: View Demo |
| Lesson 6 |
Performance Optimization |
React 19, Vite, TailwindCSS 4.x |
:globe_with_meridians: View Demo |
Current Progress
Homework 1: 5 interactive JavaScript/React tasks completed
- Trip Calculator
- Seasonal Backgrounds
- Random Number Generator
- Banking Calculations
- User Manager
Homework 2: 6 React practice tasks completed
- Login Form (Form Handling & Validation)
- Ticket Booking (Complex State Management)
- Trainer Profile (API Integration)
- Employee Management (CRUD Operations)
- Search & Filtering (Dynamic Lists)
- Kitchen Orders (Drag & Drop)
Homework 3: 2 React hooks tasks completed
- Addition Trainer (useRef for timers, useEffect cleanup)
- Hotel Booking (useRef for forms, useEffect management)
Homework 4: 2 React components practice tasks completed
- Messenger App (Component composition, Message management)
- Number Guessing Game (Turn-based gameplay, State management)
Homework 6: 4 React performance optimization tasks completed
- :zap: Selective Rendering (React.memo, useMemo for calculations)
- :bar_chart: Large Dataset Handling (react-window virtualization, useDeferredValue)
- :straight_ruler: Window Size Monitoring (Custom hooks, debouncing)
- :mag: Optimized Search (Debounced input, performance patterns)
Project Structure
Each homework assignment is in its own folder:
/hw-lesson-1/ - First homework with 5 basic tasks/hw-lesson-2/ - Second homework with 6 modern React tasks/hw-lesson-3/ - Third homework with hooks mastery/hw-lesson-4/ - Fourth homework with component practice/hw-lesson-6/ - Sixth homework with performance optimization
Technologies Used
Homework 1
- Frontend: HTML5, CSS3, JavaScript ES6+
- Framework: React 18 (CDN)
- Build Tools: Babel (JSX transpilation)
- Styling: CSS3, Modern layouts
Homework 2
- Frontend: React 18, JSX
- Build Tool: Vite
- Styling: CSS3, Custom styling
- State Management: React Hooks (useState, useEffect, useCallback)
- Features: Form validation, API integration, Drag & Drop
Homework 3
- Frontend: React 19, JSX
- Build Tool: Vite 6.3.5
- Styling: Tailwind CSS 4.1.10
- State Management: React Hooks (useState, useRef, useEffect)
- Features: Timer management, Form handling, Memory cleanup
Homework 4
- Frontend: React 19, JSX
- Build Tool: Vite 7.0.0
- Styling: Tailwind CSS 4.1.11
- State Management: React Hooks (useState, useEffect)
- Features: Component composition, Interactive applications, Game logic
Homework 6
- Frontend: React 19, JSX
- Build Tool: Vite 7.0.0
- Styling: TailwindCSS 4.x
- State Management: React Hooks (useState, useMemo, useDeferredValue, useCallback)
- Features: Performance optimization, react-window virtualization, Debouncing, Selective rendering
About the Course
This repository tracks my progress through the React JS course by Andriy Bryla. Each lesson builds upon previous concepts, gradually introducing more complex React patterns and best practices.
Live Demos
All homework assignments are deployed and available online:
- GitHub Pages: https://artemmasharipov.github.io/2025-react-course-by-andriy-bryla/
Course: React JS by Andriy Bryla (2025)
Student: Artem Masharipov
Repository: https://github.com/ArtemMasharipov/2025-react-course-by-andriy-bryla