demo-al-core-pkg v0.0.4-demo

Introduction

• 100 Phlex Pro User Portal React
• version 1.0.0

Index

• About
  • Installation
  • Commands
• Development
  • Pre-Requisites
  • Developmen Environment
  • File Structure
  • Build

About

Next.js frontend for Phlex Pro User Portal Using MobX state management

Installation

• Commands to setup project

1. Install node packages

$ npm install

Commands

• Commands to start the project.

1. Start local server

$ npm run dev

2. Build project

$ npm run build

3. Serve project from build - make sure you run npm run build first

$ npm run start

Pre-Requisites

List all the pre-requisites the system needs to develop this project.

• Node v16

Development Environment

Write about setting up the working environment for your project.

• Clone the repository.
• Make sure you are using node v16+
• Install the node modules using npm install
• Open the project using visual studio code and setup Sonarlint

Setting up SonarCloud lint configuration

1. Install Sonarlint VS code extension
2. Add the following entries into settings.json file

    "sonarlint.pathToNodeExecutable": "<<PATH>>",
    "sonarlint.connectedMode.connections.sonarcloud": [
        {
            "organizationKey": "<<ORG-KEY>>",
            "token": "<<TOKEN>>"
        },
    ],
    "sonarlint.connectedMode.project": {
        "projectKey": "<<PROJECT-KEY>>"
    },

How to find Organisation key and project key

1. Go to Sonar Cloud
2. Sign in if required (use bitbucket authentication)
3. Naviagte to on Profile > My Organisations > Atlas Labs
4. Find project name and navigate into it
5. Navigate to information on the left slide in navigation
6. Copy Org and Project key on right side of the page.

How to generate token

1. Go to Sonar Cloud
2. Sign in if required (use bitbucket authentication)
3. Navigate to on Profile > ORGANISATION_NAME
4. Navigate to Security
5. Generate Token

Checking Sonar Cloud Output

1. Open VS code commands dropdown CMD + SHIFT + P
2. Select SonarLint: Show SonarLint Output

File Structure

Add a file structure here with the basic details about files, below is an example.

Build

• Build project

$ npm run build

• Build project to run on Docker

$ docker build -t client . && docker run --name CLIENT_CONTAINER -p 0.0.0.0:3000:3000 client