Skip to main content

Getting Started

If you want to develop FullStack locally you must follow the following instructions:

  1. Clone fullstack-pro locally. Replace the git url with the project url instead.

Example:

git clone https://github.com/cdebase/fullstack-pro
cd fullstack-pro
  1. Install dependencies and build packages.

    a. make sure python version 2.7.16 or higher in ^2 version installed.

    b. install node-gyp globally. For installation check this document.

    c. install watchman for macOS users

    d. Node version supported is >=16.0.0 and yarn version is 1.22. You can Download Node from here

    e. Insall and build packages using following command. Run from the root folder of this project.

    yarn global add lerna
yarn bootstrap
  1. Setup environment file

You need to have environemnt file before you start the project. There is a sample file exist at config/development/dev.env.sample which you can copy as config/development/dev.env.

cp ./config/development/dev.env.sample ./config/development/dev.env

You may need to set personalized values in the dev.env file.

  1. Start server MongoDB and Redis (look for Installation Section)

redis-server

mongod

  1. Start both client and server together
yarn start

Alternatively (recommended), if you need to run backend and frontend on its respective terminal instead of one terminal then follow How to Start Backend and Frontend seperately

Server Enpoints:

The server endpoing you can get when the apps starts.

The graphql server endpoints typically are

http://localhost:8080/graphql

The browser server endopoint is

http://localhost:3000

Start Mobile (expo)

Follow the steps here

Start Desktop (Electron)

Follow the stesp here

How to run with HotReload for live changes both in the server and browser?

To run build with watch for dependent packages, for auto reloading changes into the server to be productive during development.

yarn watch-packages

If you also need to watch along with it, you can use as many scopes as required like below.

yarn watch-packages -- --scope=@sample-stack/counter-module* --scope=@packageb

To run build with watch for all the packages. Note: This will run watch on all packages under packages-modules and may saturate the resources in your laptop instead run above watch-packages command.

yarn watch

Sometimes if we have to run build or watch you can use the lerna command for the targeted packages

lerna exec --scope=<package name> yarn watch
  • here <package name> will be the package you working on currently. If you have multiple packages, then you need to run it multiple times for each package in its respective terminal.

How to take changes from the branch?

Most of the changes at code level can be taken using git command.

But in some cases when lerna's packages are added or versions in packages.json are updated, to avoid getting installed duplicate pacakges due to monrepo architecture you need to first clean existing node_modules and reinstall again. This can be done with following command.

yarn clean:force && git pull <branch_name> && yarn install && yarn build
  • here <branch_name> should be replaced with the branch you getting updates.

Installation of Prerequisties servers

Install redis and mongo and setup an instance with default settings on default port, Please check the installation documentation of each one.

MongoDB install :

https://www.mongodb.com/docs/manual/administration/install-community/

Redis install:

https://redis.io/docs/getting-started/

Advance Options

To test Production build and run

You need to run Frontend and Backend in two seperate servers.

to start frontend server

lerna exec --scope=*frontend-server yarn build
lerna exec --scope=*frontend-server yarn start:dev

to start backend server

lerna exec --scope=*backend-server yarn build
lerna exec --scope=*backend-server yarn start:dev

Note: you can pass :<env> next to start to use env config.

  • dev: to use /config/development/dev.env
  • stage: to use /config/staging/staging.env

Docker build and run

Build three docker images by following the steps:

  • Frontend Server
lerna exec --scope=*frontend-server yarn docker:build
lerna exec --scope=*frontend-server yarn docker:run
  • Backend Server
lerna exec --scope=*backend-server yarn docker:build
lerna exec --scope=*backend-server yarn docker:run
  • moleculer-server
lerna exec --scope=*moleculer-server yarn docker:build
lerna exec --scope=*moleculer-server yarn docker:run

Note: It uses /config/staging/docker-staging.env for environment variables.

For mac users,

###
### To connect from docker to localhost, if you are using a Mac host, you can use -
#
# HOSTNAME= docker.for.mac.host.internal
# Or
#
# HOSTNAME = docker.for.mac.localhost
###docker.for.mac.localhost

NATS_URL=nats://docker.for.mac.localhost:4222/
NATS_USER=test
NATS_PW=test
GRAPHQL_URL=http://docker.for.mac.localhost:8080/graphql
LOCAL_GRAPHQL_URL=http://docker.for.mac.localhost:8080/graphql
CLIENT_URL=http://localhost:3000
WEBHOOK_URL=http://docker.for.mac.localhost:8080
... rest of the environment

Environment settings needed for non-development

GRAPHQL_URL
CLIENT_URL
NATS_URL
NATS_USER
NATS_PW

Do's and Don't

Check here

Installation Issues

Check here

FAQ

Check here