Skip to content

vanhieuhp/react-pet-projects

Repository files navigation

React Tutorial Projects

Welcome to the React Tutorial Projects repository! This collection contains various React projects that demonstrate different concepts and features of React development.

Projects Overview

Here's a list of all available projects:

  1. Place Picker - A location-based place selection application
  2. Tic Tac Toe Game - Classic game implementation
  3. Shop Cart Project - E-commerce shopping cart functionality
  4. Core Concepts - Basic React concepts and examples
  5. Countdown Game - Timer-based game implementation
  6. Investment Calculator - Financial calculation tool
  7. StateLogin Form - Authentication form implementation
  8. Management Project - Project management application
  9. React Quiz - Interactive quiz application

Getting Started

Prerequisites

Before you begin, ensure you have the following installed:

  • Node.js (Latest LTS version recommended)
  • npm (comes with Node.js)
  • npm install --save-dev prettier eslint-config-prettier eslint-plugin-prettier

Installation

  1. Clone the repository:
git clone [repository-url]
cd react_tutorial
  1. Navigate to any project directory:
cd [project-name]
  1. Install dependencies:
npm install
  1. Start the development server:
npm run dev

Project Structure

react_tutorial/
├── place_picker/          # Location-based place selection
├── tic_tac_toe_game/      # Classic game implementation
├── shopcart_project/      # E-commerce functionality
├── core_concepts/         # Basic React concepts
├── countdown_game/        # Timer-based game
├── investment_calculator/ # Financial calculations
├── login_form/           # Authentication form
├── management_project/   # Project management
└── react_quiz/          # Interactive quiz

Common Commands

Each project supports the following npm scripts:

  • npm run dev - Start development server
  • npm run build - Build for production
  • npm run preview - Preview production build
  • npm run lint - Run ESLint

Learning Path

For beginners, we recommend following this order:

  1. Start with Core Concepts to learn the basics
  2. Move to StateLogin Form for form handling
  3. Try Tic Tac Toe Game for state management
  4. Explore Place Picker for advanced features
  5. Continue with other projects based on your interests

Contributing

  1. Fork the repository
  2. Create your feature branch (git checkout -b feature/AmazingFeature)
  3. Commit your changes (git commit -m 'Add some AmazingFeature')
  4. Push to the branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

License

This project is licensed under the MIT License - see the LICENSE file for details.

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published