https://github.com/sefatanam/loop-space
This is my personal fullstack practice repo using NX Monorepo. It's a sandbox environment where I experiment with various frontend and backend technologies, building raw implementations and testing ideas.
https://github.com/sefatanam/loop-space
angular nx nx-workspace react tailwindcss vue
Last synced: 2 months ago
JSON representation
This is my personal fullstack practice repo using NX Monorepo. It's a sandbox environment where I experiment with various frontend and backend technologies, building raw implementations and testing ideas.
- Host: GitHub
- URL: https://github.com/sefatanam/loop-space
- Owner: sefatanam
- License: gpl-3.0
- Created: 2025-04-04T18:20:33.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-05-31T21:00:52.000Z (about 1 year ago)
- Last Synced: 2025-06-21T09:05:13.964Z (12 months ago)
- Topics: angular, nx, nx-workspace, react, tailwindcss, vue
- Language: TypeScript
- Homepage:
- Size: 766 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Loop Space 
This is my personal fullstack practice repo using [**NX Monorepo**](https://nx.dev/). It's a sandbox environment where I experiment with various frontend and backend technologies, building raw implementations and testing ideas. This repo is managed using Nx, allowing me to organize all apps and libraries within a single monorepo.
## Purpose
This is not a production-ready project — it's a **raw practice ground** where I:
- Explore how different frameworks work
- Try out component libraries and state management
- Build shared utilities across apps
- Connect frontends to a NestJS backend
- Learn and make mistakes in a controlled space
## Note
Expect messy code and lots of WIP — this is where I break things to learn how to fix them. Feel free to clone, explore, and use as a reference if you're also diving into multi-framework development with Nx.
#### Requirements
- Node `22.14.0`
- Nx `v20.7.1`
> To make the nx command available globally, install nx via `npm install -g nx`.
## How to
- How to generate Apps [**Nx Plugin Registry**](https://nx.dev/plugin-registry)
- How to generate Library
```bash
nx g @nx/angular:library libs/LIBRARY_NAME
```
- How to remove Library
```bash
nx g @nx/workspace:remove LIBRARY_NAME
```
- [Learn more about this workspace setup and its capabilities](https://nx.dev/getting-started/tutorials/angular-monorepo-tutorial?utm_source=nx_project&utm_medium=readme&utm_campaign=nx_projects) or run `npx nx graph` to visually explore what was created. Now, let's get you up to speed!
## Serve App
To run the dev server for your app, use:
```sh
npx nx serve APP_NAME
```
To create a production bundle:
```sh
npx nx build APP_NAME
```
To see all available targets to run for a project, run:
```sh
npx nx show project APP_NAME
```
These targets are either [inferred automatically](https://nx.dev/concepts/inferred-tasks?utm_source=nx_project&utm_medium=readme&utm_campaign=nx_projects) or defined in the `project.json` or `package.json` files.
[More about running tasks in the docs »](https://nx.dev/features/run-tasks?utm_source=nx_project&utm_medium=readme&utm_campaign=nx_projects)
## Add new projects
While you could add new projects to your workspace manually, you might want to leverage [Nx plugins](https://nx.dev/concepts/nx-plugins?utm_source=nx_project&utm_medium=readme&utm_campaign=nx_projects) and their [code generation](https://nx.dev/features/generate-code?utm_source=nx_project&utm_medium=readme&utm_campaign=nx_projects) feature.
You can use `npx nx list` to get a list of installed plugins. Then, run `npx nx list ` to learn about more specific capabilities of a particular plugin. Alternatively, [install Nx Console](https://nx.dev/getting-started/editor-setup?utm_source=nx_project&utm_medium=readme&utm_campaign=nx_projects) to browse plugins and generators in your IDE.
[Learn more about Nx plugins »](https://nx.dev/concepts/nx-plugins?utm_source=nx_project&utm_medium=readme&utm_campaign=nx_projects) | [Browse the plugin registry »](https://nx.dev/plugin-registry?utm_source=nx_project&utm_medium=readme&utm_campaign=nx_projects)
## Useful links
Learn more:
- [Learn more about this workspace setup](https://nx.dev/getting-started/tutorials/angular-monorepo-tutorial?utm_source=nx_project&utm_medium=readme&utm_campaign=nx_projects)
- [Learn about Nx on CI](https://nx.dev/ci/intro/ci-with-nx?utm_source=nx_project&utm_medium=readme&utm_campaign=nx_projects)
- [Releasing Packages with Nx release](https://nx.dev/features/manage-releases?utm_source=nx_project&utm_medium=readme&utm_campaign=nx_projects)
- [What are Nx plugins?](https://nx.dev/concepts/nx-plugins?utm_source=nx_project&utm_medium=readme&utm_campaign=nx_projects)
And join the Nx community:
- [Discord](https://go.nx.dev/community)
- [Follow us on X](https://twitter.com/nxdevtools) or [LinkedIn](https://www.linkedin.com/company/nrwl)
- [Our Youtube channel](https://www.youtube.com/@nxdevtools)
- [Our blog](https://nx.dev/blog?utm_source=nx_project&utm_medium=readme&utm_campaign=nx_projects)