An open API service indexing awesome lists of open source software.

https://github.com/egarrisxn/xotyping

XO Typing: A Typing Game
https://github.com/egarrisxn/xotyping

javascript nextjs nextjs15 react reactjs shadcn-ui tailwindcss typescript typing-game

Last synced: 2 months ago
JSON representation

XO Typing: A Typing Game

Awesome Lists containing this project

README

        

# **XO Typing*

![opengraph-image](https://github.com/user-attachments/assets/a49fec98-b71b-4f67-8dbd-9c77156effb0)

[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) ![GitHub repo size](https://img.shields.io/github/repo-size/egarrisxn/xotyping) ![GitHub last commit](https://img.shields.io/github/last-commit/egarrisxn/xotyping)

## **Overview**

This is an easy-to-use [Next.js](https://nextjs.org) typing game [Ethan G.](https://egxo.dev).

## **Technologies**

This app leverages a modern tech stack for a smooth developer experience:

- **Programming Language**: [TypeScript](https://www.typescriptlang.org/) – Ensures type safety and better maintainability.
- **Framework**: [Next.js](https://nextjs.org/) – The leading React framework for hybrid static & server-side rendering.
- **Deployment**: [Vercel](https://vercel.com) – Optimized for seamless, serverless deployment.
- **Styling**: [Tailwind CSS](https://tailwindcss.com/) – Utility-first CSS for rapid styling.
- **Linting & Formatting**:
- [ESLint](https://eslint.org/) – Enforces code quality and best practices.
- [Prettier](https://prettier.io/) – Automatic code formatting for consistency.
- **UI Components**: [shadcn/ui](https://ui.shadcn.com/) – A flexible, customizable UI component library.
- **Animations**: [Motion](https://motion.dev) – Powerful animations with an intuitive API.
- **Icons**: [lucide-react](https://lucide.dev/) – Crisp, open-source React icons.
- **More**: TBD (Feel free to extend and customize based on your needs).

## **Before You Begin**

This app uses [pnpm](https://pnpm.io) as the default package manager for faster dependency resolution and disk space efficiency. However, you can switch to `npm`, `yarn`, or `bun` if preferred.

### Updataing Package Manager

By default, this app enforces `pnpm`. To use another package manager, follow these steps:

#### 1. Remove `pnpm` Enforcement

Open `package.json` and modify or remove the following lines:

```json
"preinstall": "npx only-allow pnpm",
"prebuild": "pnpm run lint"
```

#### 2. Install Dependencies Using Your Preferred Manager

Run one of the following commands:

```bash
npm install # or yarn install, bun install
```

Now you're ready to start building! 🚀

## **Getting Started**

#### 1. Clone the App

First, clone the repository onto your local machine:

```bash
git clone https://github.com/egarrisxn/xotyping.git xotyping
cd xotyping
```

#### 2. Install Dependencies

Run the following command to install dependencies:

```bash
pnpm install
```

#### 3. Start the Development Server

Launch the local development server:

```bash
pnpm dev
```

#### 4. Open in Your Browser

Once the server is running, open [http://localhost:3000](http://localhost:3000) with your browser to see the result.

You can start editing the page by modifying `app/page.tsx`. The page will auto-update as you edit the file. Now, get to building! 🚀

## **Deployment**

For a seamless deployment experience, use the **Deploy** button below to launch your project on Vercel.

Note: You are not limited to Vercel and may deploy this app on any platform that supports Next.js. However, in my experience, Vercel provides the fastest and most convenient setup.

[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fegarrisxn%2Fxotyping)

## **Learn More**

To explore more about Next.js, check out these resources:

- 📖 [Next.js Documentation](https://nextjs.org/docs) – Official docs covering features and best practices.
- 🛠️ [Next.js GitHub](https://github.com/vercel/next.js) – Browse the source code and contribute.

## **License**

This project is licensed under the [MIT license](https://opensource.org/licenses/MIT).

## **Contact**

If you have any questions or need further assistance, feel free to reach out to me at [github.com/garrisxn](https://github.com/egarrisxn) or send an email to [[email protected]](mailto:[email protected]) and I'll get back to you as soon as possible!