https://github.com/erkobridee/nx-frontends
Multiple frontend applications example using the Nx (Extensible Dev Tools for Monorepos)
https://github.com/erkobridee/nx-frontends
azure azure-devops frontend monorepos nrwl nx nx-workspaces react sass sharedassets typescript
Last synced: 5 months ago
JSON representation
Multiple frontend applications example using the Nx (Extensible Dev Tools for Monorepos)
- Host: GitHub
- URL: https://github.com/erkobridee/nx-frontends
- Owner: erkobridee
- License: isc
- Created: 2020-02-21T15:05:52.000Z (about 5 years ago)
- Default Branch: develop
- Last Pushed: 2023-12-15T20:30:40.000Z (over 1 year ago)
- Last Synced: 2024-04-14T14:20:14.995Z (about 1 year ago)
- Topics: azure, azure-devops, frontend, monorepos, nrwl, nx, nx-workspaces, react, sass, sharedassets, typescript
- Language: JavaScript
- Homepage:
- Size: 17.1 MB
- Stars: 8
- Watchers: 3
- Forks: 3
- Open Issues: 10
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# NxFrontends
This project was generated using [Nx](https://nx.dev) ([v12.0.6](https://github.com/nrwl/nx/releases/tag/12.0.6))
ℹ️ use the node.js v12 LTS
🌎 [Pipelines (builds) on MS Azure DevOps](https://dev.azure.com/ErkoBrideeAzure/nx-frontends/_build)
## Goal
- create 2 simple frontend application using react, have one a shared assets lib and a shared ui components lib used from both of the applications
- master how to define and use the [Azure DevOps Services | Microsoft Azure](https://dev.azure.com/) CI/CD pipelines as code ([YAML](https://yaml.org/))
- integrate the gatsby support and identify how to use it
- use the storybook support and integrate it to the azure pipelines
## Documentation
- [Dev environment known issues](docs/dev-env-known-issues.md)
- [GitHub Tips](docs/github-tips.md)
- [Nx](docs/nx.md)
- [Nx Gatsby Plugin](docs/nx-gatsby-plugin.md)
- [Nx Storybook Plugin](docs/nx-storybook-plugin.md)
- [Project creation commands (steps)](docs/project-creation-commands.md)
- [Build and release flows](docs/build-release-flow/README.md)
- [Proposed idea](docs/build-release-flow/proposed-idea.md)
- [Using the Microsoft Azure DevOps](docs/build-release-flow/azure-devops.md)
- [Pipelines flows](docs/build-release-flow/azure-devops_pipelines-flows.md)
- [Load `.yml` pipeline into Azure DevOps](docs/build-release-flow/azure-devops_load-yml-pipeline.md)
- [Trigger pipeline over a REST API call](docs/build-release-flow/azure-devops_rest-api_trigger_pipeline.md)
- [Create and use a GitHub PAT](docs/build-release-flow/github-pat.md)
## Project dependencies graph
> **implicit** - means kind of manual mapping
## Findings
- it's possible to have more flexible libs
- create an assets lib to share the SASS (.scss) common files and also the images, which is a folder with the given content needed inside (no ts or other nx lib stuff related inside of it)
- [Sass: LibSass is Deprecated](https://sass-lang.com/blog/libsass-is-deprecated) - [sass package | npm](https://www.npmjs.com/package/sass)
- have a component lib that expose the whole content of itself and with that gain more flexibility to access the shared components from others libs or applications
- it's possible to use the gatsby inside of the nx workspace, but it demands a bit of some extra manual steps to map the paths alias that will be used on the code and with that avoid to handl e the relative imports (avoid the need of this: `../..`)