idurar / typescript-react-redux-starter

Real World App : Typescript React Redux Starter Project with redux-thunk hooks , fetch api

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Typescript React Redux Starter Project

Real World App React / Redux / Typescript Clean and Simple Architecture : Typescript React Redux Starter Project with redux-thunk hooks , fetch api

Project Details

Build a simple React-Redux application which displays images from cat API. Here's the API : https://docs.thecatapi.com/api-reference/images/images-search

Example URL to fetch 10 cats with category hats: https://api.thecatapi.com/v1/images/search?limit=10&category_ids=1

Example URL to fetch the categories: https://api.thecatapi.com/v1/categories

The page is a simple app that loads a sidebar (drawer for react native) of all categories and displays 10 cat images in the main display.

  • All the categories are clickable - you can click on them and choose a different category
  • There is a button to load more cat images at the bottom, which will load 10 more cat images.
  • The app must be built with react-redux
  • Don't use any premade UI kit lib, write all styles purely, (StyledComponents library is highly recommended)
  • Aesthetics and clean code are important when building this small prototype.

Available Scripts

In the project directory, you can run:

npm start

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

The page will reload if you make edits.
You will also see any lint errors in the console.

About

Real World App : Typescript React Redux Starter Project with redux-thunk hooks , fetch api

License:MIT License


Languages

Language:TypeScript 88.0%Language:HTML 7.6%Language:CSS 4.4%