Sagui

Sagui is a modern approach on build infrastructure to front-end projects. It follows an opinionated convention over configuration approach, providing a solid foundation so that you can focus on writing your code.

Right off of the bat you get:

• JavaScript 2015 language support;
• Automated testing;
• Linting via JavaScript Standard Style;
• Build and development infrastructure;
• Live-reload via "hot module replacement".

In simpler terms, it is your last devDependency!

• No more generators;
• No more boiletplate projects;
• No more starter kits;
• No more strange global dependencies. Just node and npm.

Note: Still early in development, and might miss something that you want.

Getting started

Create a new NPM project:

npm init -y .

Install sagui in the project:

npm install --save-dev sagui

After the install is completed, Sagui bootstraps its basic infrastructure:

$ tree
.
├── node_modules
│   └── sagui
├── package.json
└── src
    ├── index.html
    ├── index.js
    ├── index.scss
    └── index.spec.js

Start developing!

npm start

Run the tests!

num test

Sagui manages the package.json scripts for you, creating additional tasks such as:

• npm run sagui:test
• npm run sagui:test-watch
• npm run sagui:develop

Then you can start writing your code inside the src/ folder.

Under the hood

Sagui is made possible by a bunch of pretty awesome projects:

• Babel;
• Karma;
• Jasmine;
• ESlint;
• JavaScript Standard Style;
• webpack;
• React transform.

But the idea is that you shouldn't worry about that.

Background

It is an idea I had in mind for a while, and after seeing a similar approach internally at Klarna (in the form of a global tool), I've got inspired to build a simpler (and locally installed) version of my own.

The internals were based on:

• gaearon/react-transform-boilerplate
• pirelenito/generator-react-webpack-component

Version 1.x.x

The first version of this project was supposed to be a project bootstrap, you can still check its original implementation at the 1.x.x branch.