npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

eos-redux

v1.4.9

Published

Redux Framework and CLI

Downloads

6

Readme

EOS Redux

eos.png

Overview

Description

EOS is an npm package that allows you to have a full redux application up and running in only a few lines of code in the console!

Vision

We are a team that strives to make coding simple and efficient, and we are working to make the React-Redux paradigm easier to get up and running and more accessible for everyone!

Table of contents

How to install

Install EOS as a global npm package

npm install -g eos-redux

You're all set!

How to use

All commands are run through the following syntax:

eos <command> [args]

Start

eos start [name]

Alternate syntax:

eos s [name]

Creates a Redux app with the name specified and a Node.js Express server.

To skip backend generation, use:

eos start [name] --backend none

The following file tree is generated for the frontend:

[name]/
  + frontend/
    + actions/
    + components/
      app.jsx
      root.jsx
      router.jsx
    + middleware/
      master_middleware.js
    + reducers/
      root_reducer.js
    + store/
      store.js
    + util/
      index.jsx
    .gitignore
    index.html  
    package.json
    webpack.config.js

Along with the creation of the file structure comes the installation of all dependencies needed. WARNING: NVM users will need to run the following commands to install dependencies:

cd [name]
npm install

All the first level dependencies included are:

  • babel-loader
  • babel-core
  • babel-preset-es2015
  • babel-preset-react
  • lodash
  • react-redux
  • react
  • react-dom
  • react-router
  • redux
  • webpack

If a backend was generated on start, the following additional dependencies are included:

  • body-parser
  • cookie-parser
  • debug
  • express
  • jade
  • morgan
  • serve-favicon
  • ejs

For ease of use we have also included a default webpack.config.js file that is structured correctly for this framework.

Generate

eos generate [action] [name]

Alternate syntax:

eos g [action] [name]

Generates an individual element or a full cycle.

It is important how you format your name if it is more than one word. Currently it is required that you enter the name in one of the following formats:

sampleName
SampleName

This command will both generate pre-filled files and place the generated middleware or reducer into the master_middleware.js or root_reducer.js respectively.

Available Actions

cycle
eos generate cycle [name]

Generates a full redux cycle for a given name. The files that will be generated are as follows:

  • frontend/components/[name]/
  • frontend/components/[name]/[name].jsx
  • frontend/components/[name]/[name]_container.jsx
  • frontend/actions/[name]_actions.js
  • frontend/middleware/[name]_middleware.js
  • frontend/reducer/[name]_reducer.js
  • frontend/util/[name]_api_util.js
component
eos generate component [name]

Generates file structure for a single component:

components/
  + [name]/
    [name]_container.js
    [name].jsx
actions
eos generate actions [name]

Generates actions file.

actions/
  [name]_actions.js
middleware
eos generate middleware [name]

Generates middleware file.

middleware/
  [name]_middleware.js
reducer
eos generate reducer [name]

Generates reducer file.

reducer/
  [name]_reducer.js
api_util
eos generate api_util [name]

Generates api_util file.

util/
[name]_api_util.js
Service
eos generate service [framework] [name]

Generates a server with its own associated environment. It is totally independent anything else in the project folder and can be deployed as its own app.

Example:

eos generate service express static_file_server

will create the following file structure:

[project root]/
  static_file_server/
    static_file_server.js
    package.json

On eos start [project name] (unless --backend none is added) this command is run as follows to setup a default server.

eos g service express server

Currently supported frameworks:

  • Express
  • Flask
  • Rails (in progress)
  • Rack (coming soon)

Remove

Remove follows the same syntax as generate and directly reverses any action that generate makes. It can be used on the full redux cycle or on any individual portion.

eos remove [type] [name]

Alternate syntax:

eos rm [type] [name]

Webpack

Run Webpack from the root directory of a project with a default server.

eos webpack

Runs webpack once in the frontend directory.

eos webpack watch

runs webpack --watch in the frontend directory. Note the slight difference in syntax here.

To enable colorized output from webpack, just do cd frontend && webpack from the root directory.

Server

eos server

If a backend was generated on start, this command starts an Express server listening on port 8000.

Development

How to Set Up Development Environment

To use a local copy of EOS Redux clone down the repo:

git clone https://github.com/amattson21/eos-redux.git

Setup the local environment:

cd eos-redux
npm install

To run commands with the local copy instead of $ eos <command> [args] use:

[path to local copy]/eos-redux/eos-cli/eos-cli.js <command> [args]

Developed by Alex Mattson with the help of many great contributors