Code Monkey home page Code Monkey logo

sportsee's Introduction

๐Ÿ“ˆ SportSee - React application

Open Source Love

Dependencies

React React Router Recharts Sass Axios Vite Vite Plugin SVGR Vite Plugin React

Dev dependencies

Prettier

๐Ÿš€ Running project

Prerequisite

Code editor

You will need a text editor to write your code. I recommend using Visual Studio Code with the Prettier extension, although you can choose whichever one you prefer.

Command Line

Throughout this README, we will ask you to use various command-line interfaces (CLIs). You can type these commands into your system's default terminal:

  • Windows: Command Prompt or PowerShell or WSL
  • macOS: Terminal
  • Linux: varies depending on distribution (e.g. GNOME Terminal, Konsole)

Most code editors also come with an integrated terminal, which you can also use.

Git

Git is a commonly-used version control system for source code.
Although having git is not strictly necessary to download the code on your computer its the recommended way to do so.
Git will also became handy later if you want to make changes to the code base.

Node.js

You need to install the Node.js runtime and its bundled npm package manager onto your system.
I recommend that you use the latest long-term support (LTS) version. The project was tested under the version 16.13.1.

Psss checkout Node Version Manger (nvm) if you want to manage multiples version on your system.

Yarn or npm

I personaly use Yarn for my package manager.
But you can use npm, simply replace yarn with npm when typing the yarn commands.

Cloning the projects

Within the directory of choice clone the following repository.

With SSH

git clone [email protected]:Lukylix/LucasGarcia_12_04032022.git sport-see

If you want to use the api you can also clone the backend:

git clone [email protected]:OpenClassrooms-Student-Center/P9-front-end-dashboard.git sport-see-back

With HTTPS

git clone https://github.com/Lukylix/LucasGarcia_12_04032022.git sport-see

If you want to use the api you can also clone the backend:

git clone https://github.com/OpenClassrooms-Student-Center/P9-front-end-dashboard.git sport-see-back

Installing the dependencies

Moove into the previously cloned respositories and type:

yarn

Configuration

You must edit the .env file before running the project like so :

Get mocked data

VITE_API_HOST and VITE_API_PORT are optional in this configuration.

VITE_DATA_SOURCE=mock

Get data from the API

VITE_API_HOST=localhost
VITE_API_PORT=3000
VITE_DATA_SOURCE=api

๐Ÿ—๏ธ Available Scripts

In the project directory, you can run:

yarn start

Runs the app in the development mode.
Open http://localhost:8000 to view it in your browser.

The page will reload when you make changes.
You may also see any lint errors in the console.

yarn run build

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes. s Your app is ready to be deployed!

See the section about deployment for more information.

yarn run serve

This command start a web server with the build folder as the root directory.

yarn run prettier

This command formats all files supported by Prettier in the current directory and its subdirectories. It use .prettierignore file to ignore things that should not be formatted and .prettierrc.json for its styling configuration.

sportsee's People

Contributors

lukylix avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.