GridCrash is a simple and engaging Tic-Tac-Toe game built with React. The game allows players to compete against each other or against the computer. The project demonstrates the use of modern React features such as hooks, context, and lazy loading, along with a service worker for offline capabilities.
- Play against another player or the computer
- Responsive design for various screen sizes
- Smooth animations using Framer Motion
- Offline capabilities with a service worker
- State management using Redux Toolkit
- Code splitting and lazy loading for improved performance
To get started with the project, follow these steps:
-
Clone the repository:
git clone https://github.com/your-username/gridcrash.git cd gridcrash
-
Install the dependencies:
npm install
- Start the development server:
npm start
- Open your browser and navigate to http://localhost:3000 to see the application in action.
gridcrash/
├── public/
│ ├── index.html
│ └── ...
├── src/
│ ├── components/
│ │ ├── MainMenu.js
│ │ ├── Game.js
│ │ └── ...
│ ├── context/
│ │ └── ThemeManager.js
│ ├── App.js
│ ├── App.css
│ ├── App.test.js
│ ├── index.js
│ ├── serviceWorker.js
│ └── ...
├── .babelrc
├── .env
├── .eslintrc.js
├── .gitignore
├── package.json
├── README.md
└── webpack.config.js
Scripts
npm start: Starts the development server.
npm build: Builds the project for production.
npm test: Runs the test suite.
npm eject: Ejects the Create React App configuration.
Technologies Used
- React
- Redux Toolkit
- React Router
- Framer Motion
- Jest and React Testing Library
- Webpack
- Babel