GitPlanet

Cheap and reliable Node.js hosting starts at $3/month, and $1/month static HTML hosting

Created with love in Canada, visit hostnodejs.com today

Feel like to post an Ad? Learn Details
All Projects → cmacdonnacha → awesome-address-book

cmacdonnacha / awesome-address-book

Licence: MIT License
This project shows a basic address book built with ReactJS, Redux Toolkit and Typescript 📖

Programming Languages

typescript
32286 projects
javascript
184084 projects - #8 most used programming language
HTML
75241 projects

Labels

react-routereslintjestreactjscontactsprettieraddress-bookcypressreact-testing-librarygithub-actionsredux-toolkitstyled-icons

Projects that are alternatives of or similar to awesome-address-book

react16-seed-with-apollo-graphql-scss-router4-ssr-tests-eslint-prettier-docker-webpack3-hot
Seed to create your own project using React with Apollo GraphQL client
Stars: ✭ 19 (-5%)
Mutual labels:  react-router, eslint, jest, prettier
glific-frontend
Frontend for the Glific platform
Stars: ✭ 18 (-10%)
Mutual labels:  react-router, jest, cypress, react-testing-library
Starter React Flux
Generate your React PWA project with TypeScript or JavaScript
Stars: ✭ 65 (+225%)
Mutual labels:  react-router, eslint, jest, prettier
eslint-config-adjunct
A reasonable collection of plugins to use alongside your main esLint configuration
Stars: ✭ 39 (+95%)
Mutual labels:  eslint, jest, prettier, cypress
React Ssr Starter
All have been introduced React environment
Stars: ✭ 20 (+0%)
Mutual labels:  react-router, eslint, jest, prettier
Express React Boilerplate
🚀🚀🚀 This is a tool that helps programmers create Express & React projects easily base on react-cool-starter.
Stars: ✭ 32 (+60%)
Mutual labels:  react-router, eslint, jest, prettier
Reeakt
A modern React boilerplate to awesome web applications
Stars: ✭ 116 (+480%)
Mutual labels:  react-router, eslint, jest, prettier
react-component-library-lerna
Build your own React component library managed with lerna, presented with storybook and published in private npm registry.
Stars: ✭ 55 (+175%)
Mutual labels:  eslint, jest, prettier
typescript-api-starter
🔰 Starter for Node.js express API in Typescript 🚀
Stars: ✭ 72 (+260%)
Mutual labels:  eslint, prettier, github-actions
nextjs-baseweb
Slightly opinionated scaffold of Next.js and Base Web.
Stars: ✭ 46 (+130%)
Mutual labels:  eslint, jest, prettier
Express-REST-API-Template
Minimal starter project for a Node.js RESTful API based off express generator
Stars: ✭ 26 (+30%)
Mutual labels:  eslint, jest, prettier
zero
📦 A zero config scripts library
Stars: ✭ 17 (-15%)
Mutual labels:  eslint, jest, prettier
reactjs-vite-tailwindcss-boilerplate
ReactJS + Vite boilerplate to be used with Tailwindcss.
Stars: ✭ 103 (+415%)
Mutual labels:  eslint, jest, prettier
react-learning-resources
A curated list of resources to learn React and related web technologies as fast as possible.
Stars: ✭ 65 (+225%)
Mutual labels:  react-router, cypress, react-testing-library
ts-nextjs-tailwind-starter
🔋 Next.js + Tailwind CSS + TypeScript starter packed with useful development features
Stars: ✭ 880 (+4300%)
Mutual labels:  eslint, jest, github-actions
walrus
🎉 Cli development framework.
Stars: ✭ 17 (-15%)
Mutual labels:  eslint, jest, prettier
web-extension-boilerplate
The web extension boilerplate help to set up project quickly using typescript, jest, webpack, githook, prettier and github actions
Stars: ✭ 35 (+75%)
Mutual labels:  jest, prettier, github-actions
generator-node
🔧 Yeoman generator for Node projects.
Stars: ✭ 16 (-20%)
Mutual labels:  eslint, jest, prettier
nextjs-starter-kit
NextJS Starter Kit with Testing Frameworks and CI/CD
Stars: ✭ 30 (+50%)
Mutual labels:  eslint, jest, cypress
minesweeper
💣Minesweeper game written with React
Stars: ✭ 18 (-10%)
Mutual labels:  jest, react-testing-library, github-actions
View All Similar Projects ➔

📖 Awesome Address Book 📖


This project shows a basic address book built with ReactJS, Redux Toolkit, React Router and Typescript 🚀

contributions

Includes

 

Features

🔍   Contacts search with infinite scrolling
🧔   Nationalities selection
📞   Mobile friendly / Responsive design
♿   Accessability compliant
🧪   Unit & Integration tests
🧭   Sidebar navigation

 

Live Demo

Check out the live demo

 

Set up

  1. git clone https://github.com/cmacdonnacha/awesome-address-book.git awesome-address-book
  2. cd awesome-address-book
  3. npm install
  4. That's it! See the Available Commands list below.

 

Available Commands

npm start

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

npm test

Runs unit and integration tests in watch mode. Use npm run test:no-watch to run tests without a watcher.

npm run test:no-watch

Runs unit and integrations tests without a watcher.

npm run test:coverage

Displays the code coverage within the console and also generates a coverage folder.

To view the code coverage report in your browser open the index.html file within the coverage/lcov-report folder.

npm run test:e2e

Runs end-to-end tests using Cypress. This will run using the Electron (headless) browser which comes with Cypress. You can also view the latest test runs online via this project's Cypress Dashboard

npm run test:open

Runs end-to-end tests and opens a window to see the results running on your machine.

npm run lint

Runs the ESLint typescript code lint checker. Running npm run lint:fix will automatically fix any lint errors where possible.

npm run build

Builds a production version of the app inside the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

npm run analyze

This will run a production build and then analyze the output using source-map-explorer which analyzes JavaScript bundles using the source maps. This helps you understand where code bloat is coming from.

 

CI/CD

This project uses Github actions to continuously test, build and deploy. You can see the workflow file in the workflows folder.

CI/CD Screenshot

 

License

Licensed under the MIT license.

 

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].