Skip to content

This repository contains three JavaScript-based projects: Context Language Toggle, Tic-Tac-Toe, and Todo App. These projects demonstrate front-end development skills using React and React Native, focusing on state management, event handling, and UI interactions.

License

Notifications You must be signed in to change notification settings

am-i-groot/coderbyte-javascript-challenges

Repository files navigation

Coderbyte JS Challenges

This repository contains four beginner-friendly JavaScript projects built using React.js:

  1. Context API Example - Demonstrates global state management using React's Context API.
  2. Context Language Toggle - Demonstrates global state management using React's Context API.
  3. Tic-Tac-Toe Game - A simple interactive game built with React.
  4. Todo App - A CRUD-based task management application.

๐ŸŒ Live Project Links

1๏ธโƒฃ Context API Example
2๏ธโƒฃ Context Language Toggle
3๏ธโƒฃ Tic-Tac-Toe Game
4๏ธโƒฃ Todo App (Expo)

๐Ÿ“‚ GitHub Repositories


Projects

Context Language Toggle

Overview: A React app that allows users to toggle between different programming languages using the Context API.

Technologies Used:

  • React.js
  • Context API
  • Hooks (useState, useContext)

Features:

  • Supports toggling between JavaScript and Python.
  • Uses Context API for global state management.
  • Dynamically updates displayed language.

Run the Project:

cd context-language-toggle
npm install
npm start

Tic-Tac-Toe Game

Overview: A classic Tic-Tac-Toe game built using React, allowing two players to take turns making moves.

Technologies Used:

  • React.js
  • useState Hook
  • Conditional Rendering

Features:

  • Two-player gameplay.
  • Win detection logic.
  • Restart button to reset the game.
  • 3x3 grid with interactive UI.

Run the Project:

cd tic-tac-toe
npm install
npm start

Todo App

Overview: A React Native task management application that allows users to add, edit, and remove tasks.

Technologies Used:

  • React Native
  • useState Hook
  • FlatList Component

Features:

  • Add new tasks via a text input field.
  • Edit existing tasks with an "Edit" button.
  • Delete tasks with a "Remove" button.
  • Uses FlatList for optimized task rendering.

Run the Project:

cd todo-app
npm install
npx react-native run-android  # For Android
npx react-native run-ios       # For iOS

How to Run

  1. Clone this repository:
    git clone https://github.com/am-i-groot/coderbyte-javascript-challenges
    cd coderbyte-javascript-challenges
  2. Navigate to any project folder and install dependencies:
    cd project-folder
    npm install
  3. Start the development server:
    npm start

Contributing

Feel free to fork the repository, submit issues, and contribute improvements.


License

This project is licensed under the MIT License.

About

This repository contains three JavaScript-based projects: Context Language Toggle, Tic-Tac-Toe, and Todo App. These projects demonstrate front-end development skills using React and React Native, focusing on state management, event handling, and UI interactions.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published