mat-desyre v0.0.3

MAT Desyre

This project was generated with Angular CLI version 9.1.7.

Renault Design System theme for Angular Material projetcts.

About

Demo

Live Demo - A demo app showcasing mat-desyre usage.

🚀 Quick start

1. Install via npm or yarn

npm install --save mat-desyre
# or
yarn add mat-desyre

2. Import Desyre theme in your Application main style file

@import '~css-desyre/dist/css/desyre-theme.css';

..or define

  "styles": [
    "./node_modules/mat-desyre/dist/css/desyre-theme.css",
    ...
  ],

How to contribute

🚀 Quick start contributer

workflow

• configure Renault artifactory
• Clone the repo : git clone https://gitlabee.dt.renault.com/design-system/desyre/mat-desyre.git
• checkout develop : git checkout develop
• pull develop : git pull origin develop
• create your feature : git checkout -b "feature/dsr-feature-name"
• keep it nice & simple (dev and test)
• make a merge request
• fix things if needed
• the code review pass and have 2 approvals
• finish feature git checkout develop && git merge "feature/first-feature"

development

• from mat-desyre root folder
• install dependencies: npm ior yarn install
• build the lib: npm run build:theme
• Serve the showcase to see you development: npm run serve:showcase
• Then Navigate to http://localhost:4200/

Contribution Workflow 🚧

Please take a moment to review the (CONTRIBUTING document)./docs/CONTRIBUTING.md in order to make the contribution process easy and effective for everyone involved.

The issue tracker is the preferred channel for bug reports, features requests and submitting merge requests.

🎖 Review and Merge

Remove WIP status from merge request and start review process before merge it into INTEGRATION branch.

A good practice is to invite other reviewer to comment and improve changes collaboratively on the merge request until it's approbation.

🔧 Getting Started / Set up

These instruction will get you a copy of the project up and running on your local machine for development and tests purposes.

You can find all the project dependencies in package.json. The main components and technologies used here are: npm, javascript, angular cli, angular, rxjs, docker, gitlab cicd, karma, jasmine, cypress, cucumber.

NODE / NPM

Open the Terminal App and install node via Brew

brew update
brew install node

Make sure you have Node and NPM installed by running

node -v
npm -v

If you need to manage multiple active node.js versions, you can use NVM

curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.2/install.sh | bash

Configure Renault artifactory:

• Connect to Renault artifactory to ensure your account is already created
• Go to your profile and get your API key (or generate it and copy it)
• Then configure artifactory in your npm settings:

npm config set registry https://artifactory.dt.renault.com/artifactory/api/npm/npm/
npm login
# and enter: your ipn as username, copied API key as password, and your email

This will generate the .npmrc file in the project's root folder. The file won't be commited to git. This operation will be executed only once, at the beginning.

Install dependencies

Run npm install to download dependencies of the project

cd mat-desyre
npm i

Build the lib

npm run build:theme 

The build artifacts will be stored in the dist/ directory. Use the --prod flag for a production build.

Development server

Serve the showcase to see you development

Run go to ./showcase/material-app folder and ng serve for a dev server.

Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.

Theme a component

...TO DO

├── src
│   ├── components              # components scss theme files
│   │   └── buttons.scss        # scss file for the button theming
│   │   └── checkbox.scss       # scss file for the checkbox theming
│   │   └── chips.scss          # scss file for the chips theming
│   │   └── ...
│   ├── common.scss              # common scss theming utilities
│   └── desyre-theme.scss        # main scss theming file

TEST

Lint scsss

...TO DO

Running unit tests

...TO DO

Running end-to-end tests

...TO DO

Further help

To get more help on the Angular CLI use ng help or go check out the Angular CLI README.

Some more Quality

🔥 conventionnal commit

A specification for adding human and machine readable meaning to commit messages

https://www.conventionalcommits.org/

Each commit trigger a hook which check the commit message format:

> <type>[optional scope]: <description>
> 
> [optional body]
> 
> [optional footer(s)]

For more info see .commitlintrc.js file

Hooks are located in .huskyrc.json file

Husky run lint, prettier and unit test for each commit

🎉 Release with Standard Version

CAUTION: ONLY USED when releasing a new version

A utility for versioning using semver and CHANGELOG generation powered by Conventional Commits.

standard version : https://www.npmjs.com/package/standard-version

npm run release