conradob/react-atomic-components

React atomic components

Features

• Typesystem
• Atomic commits
• Atomic components
• Unit tests
• E2E tests
• Theme support for entire app

Tech

• ReactJS built bootstrapped with Create React App.
• Typescript static typing.
• React Query for fetch, cache and update data.
• Style Components CSS-inJS tool
• Jest JS Testing Framework.
• Testing Library Testing utilities
• Cypress End-to-end testing.
• Docker Run application and services in containers.

Todos

• Fields to list issues from other repositories
• Filters
• Pagination
• Write more tests

Installation

Install the dependencies and devDependencies.

cd omnipresent-challenge
npm install

Available Scripts

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.

npm test

Launches the test runner in the interactive watch mode.

npm 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.
Your app is ready to be deployed!

End-to-end

With containers

It's possible to run E2E tests with containers using Docker

docker-compose up

Whout containers

Installation

cd e2e
npm install

Available Scripts

Make sure to start the react app before running the following scripts.

npx cypress open

Opens the Cypress Test Runner.

npx cypress run

Run all tests headlessly in the Electron browser.