-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: add readme and delete unused ones
- Loading branch information
1 parent
e201c1b
commit e0f7dc4
Showing
3 changed files
with
124 additions
and
54 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,37 +1,138 @@ | ||
# Turborepo kitchen sink starter | ||
# Cricket Player App 🏏 | ||
|
||
This is an official starter Turborepo with multiple meta-frameworks all working in harmony and sharing packages. | ||
### An application showcasing cricket players' biographies and career statistics. This project demonstrates the use of the Backend for Frontend (BFF) design pattern in a real-world application. | ||
|
||
This example also shows how to use [Workspace Configurations](https://turbo.build/repo/docs/core-concepts/monorepos/configuring-workspaces). | ||
## Table of Contents | ||
|
||
## Using this example | ||
- [Demo](#demo) | ||
- [Features](#features) | ||
- [Project Breakdown](#project-breakdown) | ||
- [Getting Started](#getting-started) | ||
- [Technologies Used](#technologies-used) | ||
- [Contribute](#contribute) | ||
|
||
Run the following command: | ||
## Demo | ||
|
||
```sh | ||
npx create-turbo@latest -e kitchen-sink | ||
 | ||
|
||
## Features | ||
|
||
✔️ List Countries and Players\ | ||
✔️ Select a Country and Player\ | ||
✔️ Search a Country and Player\ | ||
✔️ Display Player's Statistics based on the selections | ||
|
||
## Project Breakdown | ||
|
||
This application is a [turborepo](https://turbo.build/repo/docs) comprised of two apps and various packages that are shared across both apps. This is how the scaffolding looks: | ||
|
||
 | ||
|
||
### Apps | ||
|
||
In the project, there's an `apps` folder which contains two applications: | ||
|
||
1. api | ||
2. client | ||
|
||
**api**\ | ||
This app is an Express.js project with a basic setup that exposes several APIs. The following is the list of endpoints: | ||
|
||
```text | ||
/countries | ||
/players | ||
/players/:id | ||
/players/:id/career | ||
``` | ||
|
||
## What's inside? | ||
These endpoints return information about all the countries in the world and the players in each country. | ||
This data is fetched through a public API [sportsmonks](https://docs.sportmonks.com/cricket) | ||
|
||
**client** | ||
This app was built in NextJs 14. It has two main parts | ||
|
||
1. Frontend Part | ||
2. Server Part | ||
|
||
In the Frontend we have all the components as usual which takes care of the UI. | ||
In the Server, we have implemented a Backend for Frontend (BFF) logic. | ||
|
||
This is how our server (BFF) is handling Frontend requests. | ||
|
||
 | ||
|
||
### Packages | ||
|
||
In the project, there's a `packages` folder which have five packages i.e. | ||
|
||
1. config-eslint | ||
2. config-tailwind | ||
3. config-typescript | ||
4. jest-presets | ||
5. logger | ||
6. types | ||
|
||
**config-eslint**. **config-tailwind**, **config-typescript**, and **jest-presets** are libraries that are used across both apps or meant to be in future. | ||
|
||
This Turborepo includes the following packages and apps: | ||
**logger** is a custom package which wrapps around console.log to supress eslint warnings and keep the logs of applications. | ||
|
||
### Apps and Packages | ||
> Note that logger has two functions i.e. `logClient` and `logAPI` | ||
- `api`: an [Express](https://expressjs.com/) server | ||
- `client`: a [Next.js](https://nextjs.org/) app | ||
- `@repo/eslint-config`: ESLint configurations used throughout the monorepo | ||
- `@repo/jest-presets`: Jest configurations | ||
- `@repo/logger`: isomorphic logger (a small wrapper around console.log) | ||
- `@repo/typescript-config`: tsconfig.json's used throughout the monorepo | ||
**types** is custom package which contains types that are shared across the apps. | ||
|
||
## Getting Started | ||
|
||
These instructions will get you a copy of the project up and running on your local machine for development and testing purposes. | ||
|
||
### Requirements | ||
|
||
You'll need [Git](https://git-scm.com), [Node.js](https://nodejs.org/en/download/), and [pnpm](https://pnpm.io/) installed on your computer with the following versions: | ||
|
||
``` | ||
[email protected] or higher | ||
[email protected] or higher | ||
[email protected] or higher | ||
``` | ||
|
||
### How To Use | ||
|
||
From your command line, clone and run `cricket-player-app`: | ||
|
||
```bash | ||
# Clone this repository | ||
git clone https://github.com/asadkhalid305/cricket-player-app | ||
|
||
# Go into the repository | ||
cd cricket-player-app | ||
|
||
# Setup default environment variables | ||
|
||
# For Linux | ||
cp .env.example .env | ||
# For Windows | ||
copy .env.example .env | ||
|
||
# Install dependencies | ||
pnpm install | ||
|
||
# Start a local development server | ||
# This command will start both of your applications | ||
pnpm dev | ||
|
||
# Start client app only | ||
pnpm dev:client | ||
|
||
# Start api app only | ||
pnpm dev:api | ||
``` | ||
|
||
Each package and app is 100% [TypeScript](https://www.typescriptlang.org/). | ||
## Technologies Used | ||
|
||
### Utilities | ||
- [NextJs](https://nextjs.org/) | ||
- [Tailwind CSS](https://tailwindcss.com/) | ||
- [ExpressJs](https://expressjs.com/) | ||
- [Turborepo](https://turbo.build/repo/docs) | ||
|
||
This Turborepo has some additional tools already setup for you: | ||
## Contribute | ||
|
||
- [TypeScript](https://www.typescriptlang.org/) for static type checking | ||
- [ESLint](https://eslint.org/) for code linting | ||
- [Jest](https://jestjs.io) test runner for all things JavaScript | ||
- [Prettier](https://prettier.io) for code formatting | ||
If you'd like to make this app better for other users, create issues to improve this project. Or if you have created something awesome for your fork and want to share it, feel free to open a pull request. |
This file was deleted.
Oops, something went wrong.
This file was deleted.
Oops, something went wrong.