Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/proyecto26/projectx
Tame full-stack chaos with Temporal workflows and React wizardry, the ultimate event-driven architecture for your apps π§ββοΈβ¨
https://github.com/proyecto26/projectx
event-driven-architecture event-driven-microservices full-stack full-stack-application full-stack-developer full-stack-development full-stack-web-development monorepo monorepo-boilerplate nestjs nestjs-boilerplate nodejs nx-monorepo react reactjs remix remix-run temporal temporalio
Last synced: about 1 month ago
JSON representation
Tame full-stack chaos with Temporal workflows and React wizardry, the ultimate event-driven architecture for your apps π§ββοΈβ¨
- Host: GitHub
- URL: https://github.com/proyecto26/projectx
- Owner: proyecto26
- Created: 2024-10-06T21:06:32.000Z (4 months ago)
- Default Branch: develop
- Last Pushed: 2024-11-23T05:33:35.000Z (2 months ago)
- Last Synced: 2024-12-29T05:33:53.464Z (about 1 month ago)
- Topics: event-driven-architecture, event-driven-microservices, full-stack, full-stack-application, full-stack-developer, full-stack-development, full-stack-web-development, monorepo, monorepo-boilerplate, nestjs, nestjs-boilerplate, nodejs, nx-monorepo, react, reactjs, remix, remix-run, temporal, temporalio
- Language: TypeScript
- Homepage:
- Size: 1.13 MB
- Stars: 23
- Watchers: 1
- Forks: 0
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# ProjectX
> **ProjectX** is a comprehensive full-stack template designed to simplify the development of scalable and resilient applications using **React** and **Temporal**. By integrating Temporalβs advanced workflow orchestration with Reactβs dynamic frontend framework, ProjectX enables developers to build applications with durable executions and seamless communication between services.
## Notable Links π€
- [Get started with Temporal and TypeScript](https://github.com/temporalio/sdk-typescript)
### Public Courses
- [Temporal 101 with TypeScript](https://temporal.talentlms.com/catalog/info/id:135)
- [Temporal 102: Exploring Durable Execution with TypeScript](https://temporal.talentlms.com/catalog/info/id:165)
- [Versioning Workflows with TypeScript](https://temporal.talentlms.com/catalog/info/id:171)
- [Interacting with Workflows with TypeScript](https://temporal.talentlms.com/catalog/info/id:207)
- [Securing Temporal Applications with TypeScript](https://temporal.talentlms.com/catalog/info/id:211)
- [Introduction to Temporal Cloud](https://temporal.talentlms.com/catalog/info/id:144)
- [Crafting an Error Handling Strategy with TypeScript](https://temporal.talentlms.com/catalog/info/id:244)
## Why Temporal? π€
### Challenges of Maintaining State in Distributed Systems
- Consistency
- Fault Tolerance
- Scalability
- Concurrency Control
- Security
**Temporal** is introduced here as a **Workflow Orchestration** tool for managing long-running operations **(durable execution)**, humans in the loop and system lifecycle **(state management, guaranteed completion with compensations and uniqueness)**.
You can use **Temporal** today for implementing a sequence of steps/actions in certain order for your business processes **(workflows)**,
not only for communication between services **(Microservices Orchestration)** but also for **Monolith** apps.
**Workflows** can react to async and external events **(signals, updates)**, aggregating data and then doing some actions **(activities)** with exponential retries **(retry policy)** and run for extended periods **(heartbeat)** if needed, then you can check the state of these executions at any time **(queries)**.
Additionally, workflows support scheduled and time-based executions with configurable delays for recurring business logic **(scheduling)**.
### Use Cases
β’ **Order Processing Systems:** Managing the lifecycle of orders from placement to fulfillment, including inventory checks, payment processing, and shipping.
β’ **User Onboarding:** Coordinating steps involved in onboarding new users, such as account creation, email verification, and initial setup tasks.
β’ **Data Pipelines:** Orchestrating data ingestion, transformation, and storage processes with reliability and scalability.
β’ **Batch Processing:** Handling large-scale batch jobs with retry mechanisms and progress monitoring.
## Setting Up π οΈ
### Requirements π§°
- [Node.js LTS Version](https://nodejs.org)
- [Git](https://git-scm.com/downloads)
- [Docker Compose](https://docs.docker.com/compose/install)
- Code editor:
- [VSCode](https://code.visualstudio.com/)
- [Cursor](https://www.cursor.com/)
### From Linux/Mac ο£Ώ
- Install Homebrew
- Install tools using Homebrew:
```sh
brew install node
brew install git
brew install docker-compose
npm add --global nx@latest
```
### Documentation π
- **FrontEnd:**
Commands used to create the project and frontend structure (Nx, RemixJS, etc) [here](./docs/frontend/README.md).
- **BackEnd:**
Commands used to create the services (NestJS, Temporal, etc) [here](./docs/backend/README.md).
## Usage π
### Monorepo
Instructions to use Nx CLI [here](./docs/NX_README.md).
For more information on using Nx, refer to the [Nx documentation](https://nx.dev/getting-started/intro).
### Project Structure Overview
Markmap format π¬
```markmap
#### Root Directory
- **package.json**: Contains the dependencies and scripts for the entire monorepo.
- **nx.json**: Configuration for Nx, which manages the monorepo structure and build processes.
- **tsconfig.base.json**: Base TypeScript configuration shared across the project.
#### Apps
- **apps/auth**:
- **Purpose**: Handles user authentication and data retrieval.
- **Key Features**: Login, registration, and user profile management.
- **apps/order**:
- **Purpose**: Manages order processing, checkout, and payment handling.
- **Key Features**: Cart management, order tracking, and payment integration.
- **apps/web**:
- **Purpose**: The main web application interface.
- **Key Features**: User interaction with the system.
- **Configuration**:
- **tsconfig.json**: TypeScript configuration specific to the web app.
#### Libs
- **libs/backend/core**:
- **Purpose**: Contains business logic and common utilities.
- **Key Features**: Shared functions and services used across backend applications.
- **libs/backend/db**:
- **Purpose**: Manages database access using Prisma and the Repository pattern.
- **Key Features**: Database schema definitions and data access layers.
- **Documentation**:
- **README.md**: Provides details on database setup and usage.
- **libs/backend/email**:
- **Purpose**: Handles email template creation and sending.
- **Key Features**: Uses MJML for templates and provides email sending services.
- **libs/models**:
- **Purpose**: Defines DTOs and common types.
- **Key Features**: Ensures consistency across web and backend services.
- **libs/frontend/ui**:
- **Purpose**: Contains UI components and themes.
- **Key Features**: Built with React and TailwindCSS, includes Storybook for component visualization.
- **Configuration**:
- **package.json**: Dependencies and scripts for the UI library.
- **tsconfig.json**: TypeScript configuration for the UI library.
#### Additional paths
- **prompts**: Contains initial project prompts or guidelines to be used with your AI tools (Cursor, etc).
```
### Run the web app
```sh
npm run dev:web
```
### Run the ui lib (See all the UI components)
```sh
npm run storybook
```
### Run services with Docker Compose
- Build the images:
```sh
docker-compose build --no-cache
```
- Run the services:
```sh
docker-compose up -d
```
- Delete the services:
```sh
docker-compose down --volumes
```
## Explore the project π
```sh
npx nx show projects
npx nx graph
```
View the Database diagram [here](./libs/backend/db/README.md).
Do you want to change the path of a project to decide your own organization? No problem:
```sh
npx nx g @nx/workspace:move --project core libs/backend/common
```
## Update project β‘
```sh
npx nx migrate latest
npx nx migrate --run-migrations
```
## Docker π’
- Images:
* https://registry.hub.docker.com/r/postgis/postgis/
* https://registry.hub.docker.com/r/temporalio/auto-setup
* https://registry.hub.docker.com/r/temporalio/admin-tools
* https://registry.hub.docker.com/r/temporalio/ui
All the images needed to run this project in development are listed in the [docker-compose.yml](./docker-compose.yml) file.
## Supporting π»
I believe in Unicorns π¦
Support [me](http://www.paypal.me/jdnichollsc/2), if you do too.
Donate **Ethereum**, **ADA**, **BNB**, **SHIBA**, **USDT/USDC**, **DOGE**, etc:
> Wallet address: jdnichollsc.eth
Please let us know your contributions! π
## Happy coding π―
Made with β€οΈ
