Atomic Jolt's front-end library code


Keywords
react, reactjs, redux
License
MIT
Install
npm install atomic-fuel@4.6.0

Documentation

๐Ÿ”‹ Atomic Fuel

This package contains all of the front-end library code for Atomic Jolt apps. It includes all front-end code that was previously in the client/libs directory.

๐Ÿงฑ Installation

You should install atomic fuel into each individual app not in the client directory. Just add as a regular dependency.

yarn add atomic-fuel

๐Ÿง‘โ€๐Ÿ”ฌ Usage

All of the code is found in the libs folder which has the following structure

libs/
-- actions
-- api
-- communications
-- components
-- constants
-- decorators
-- graphql
-- libs
-- loaders
-- middleware
-- reducers
-- specs_support
-- store

If you wanted to use, for example, libs/store/configure_store.js you would write the following:

import configureStore from 'atomic-fuel/libs/configure_store.js';

Alternatively, there is an index file which simply exports everything for convenience, so you can do this:

import { configureStore } from 'atomic-fuel';

๐Ÿ› ๏ธ Development

Develop using Storybook, which features hot-reloading, component browsing, and testing of React Components.

Run Storybook: yarn storybook

๐Ÿ“ Note

Component file structure should be organized in the following structure.

src/components/
-- ComponentName/
---- index.js
---- index.spec.js
---- index.stories.js
---- styles.scss

๐Ÿšง Building

To build the lib folders and types run: yarn build

๐Ÿงช Testing

Run tests: yarn test

Run tests with Chrome DevTools (i.e. use debugger in your tests):

  1. Open a Chromium browser at chrome://inspect
  2. Click on the "Open dedicated DevTools for Node"

Then you can run tests using: yarn test:debug