/trivia-game-zone

❓ Quiz challenge to test your quiz knowledge.❓

Primary LanguageJavaScript

Intro

Trivia Quiz Challenge

Getting Started

First install libraries from package.json:

git clone <repo-url>
npm install

Once it's installed, you can run npm start, to run the react application and it will run the development server on your local machine, and give you a URL to browse.

Dev Tools

Edit, build and debug with ease

VS Code Extension

  • Eclipse key map
  • MDX Extension
  • Git lens

Chrome Extension

  • React dev tools

Best Practices

  • ATOMIC - To design component
  • Styling - styled-components
  • Images - SVGR (Scalable Vector Graphics React)
  • kebab-Case for constants variables

Development scripts

Note: Run the following commands in the \root\ folder to see the results.

npm start

it will run the development server on your local machine

npm test

boolean check if unit tests all pass - uses jest and enzyme

npm run storybook

it will run the development server on your local machine, and give you a URL to browse some sample stories.

Code-splitting

Code-splitting with React. It's a process of taking one large bundle containing your entire app and splitting them up into multiple smaller bundles that contain separate parts of your app.

Packages

Packages
[a11y] Test components for user accessibility in Storybook
[actions] Log actions as users interact with components in the Storybook UI
[docs] Add high quality documentation to your components
[knobs] Interactively edit component prop data in the Storybook UI
[jest] Testing framework created by facebook
[enzyme] Testing utility for React created by Airbnb
[axios] A promise-based HTTP client that works in both client and server
[lodash] JS library which provides utility func for common programming tasks
[node-sass] CSS preprocessor
[react-router-dom] Client side navigation
[react-intl] JS library for translation
[prop-types] Props type check

😃 Happy Coding 😃