Skip to main content

Getting Started

It is easy to start using the FrontHub in your Microfrontend, while we are in favor of convention over configuration, there are some steps that you should follow to start using it. This section helps to clarify what to do.

Setup​

First, let’s make sure that your development environment is ready.

  • You'll need to install Node.js version 12.14.1 or later. We recommend you install using NVM to solve permission issues.
  • We recommend using Yarn version 1.5 or later (which can be checked by running yarn version). Yarn is a great package manager for JavaScript and replaces the npm client. It is not strictly necessary but highly encouraged.
  • You'll need to configure JFrog as NPM registry.

JFrog NPM Registry​

This setting will give you permission to install our modules. You can setup easily by running:

bash -c "$(curl -fsSL https://front-hub.rdstation.com.br/jfrog-setup.sh)"

Quick Start​

npx @resultadosdigitais/front-hub-cli init my-app
cd my-app/packages/main
yarn start

If you've previously installed @resultadosdigitais/front-hub-cli globally via installation below or npm install -g @resultadosdigitais/front-hub-cli, we recommend you uninstall the package using npm uninstall -g @resultadosdigitais/front-hub-cli or yarn global remove @resultadosdigitais/front-hub-cli to ensure that npx always uses the latest version.

(npx comes with npm 5.2+ and higher, for older npm version use the installation instructions below)

Welcome to FrontHub App​

Running the command above you should see a page like this when you access http://localhost:3000. This is the starter FrontHub template.

Starter FrontHub Template

Scripts​

Inside the Microfrontend (/packages/main) of the newly created project, you can run some built-in commands:

yarn start​

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

yarn fake [command]​

Runs the FrontHub CLI command, useful for fake some behavior during development, to know more use the fake command instructions

yarn test​

Runs the test watcher in an interactive mode.

yarn build:prod​

Builds the app for production to the build folder.