/supercell-react

Primary LanguageTypeScript

SuperCell

This is a clone of Supercell website.

Summary

Getting Started

Clone this repository

git clone https://github.com/ombharatiya/supercell-react.git

Get into project directoty

cd supercell-react

Setting up the react project

npm install

Run the project locally

npm start

The server would be running at http://localhost:3000

Done! Now enjoy the beautiful app :)

Prerequisites

To run the project you must have node installed in your machine.

node v12.13.1

Create Build

To deploy this application, you require to create a build

npm run build

Built With

The app uses following libraries/packages for development & build:

  • React.js - An open-source JavaScript library for building user interfaces & single-page or mobile applications.
  • Redux.js - A Predictable State Container for JS Apps
  • Redux-Saga - A Redux Middleware library to handle Asynchronous Actions such as fetching data more easily & effciently
  • React-Router - A package that provides the core routing functionality for React Router
  • Axios - Promise based HTTP client for the browser and node.js. It gives out of the box client side support for protecting against XSRF
  • TypeScript - a superset of JavaScript programming language that compiles to clean JavaScript output.

Features

  • Home page For Home page redirect the user to localhost:3000/home
  • Games page For Games redirect the user to localhost:3000/games
  • Hay Day Game page For Hay Day redirect the user to localhost:3000/games/hayday
  • Navigation
  • Footer
  • State Management

Project Structure

--- src/
-------- assets
-------- components
------------- Footer.tsx
------------- NavigationBar.tsx
-------- models
------------- Paragraph.ts
-------- modules
------------- games
------------- hayDay
------------- home
------------- constants.ts
-------- services
------------- getParagraph1
------------- getParagraph2
------------- hayDayServices
------------- urls.ts
-------- store
------------- actions
----------------- Paragraph1Actions.ts
----------------- Paragraph2Actions.ts
------------- reducers
----------------- Paragraph1Reducer.ts
----------------- Paragraph2Reducer.ts
----------------- RootReducer.ts
------------- sagas
----------------- Sagas.ts
----------------- hayDaySagas.ts
------------- state
----------------- ParagraphState.ts
------------- Store.ts
------------- storeHelper.ts
-------- styles
-------- App.tsx
--- package.json
--- tsconfig.json

Author