Home

Awesome

<p align="center"> <img src="./.github/images/alpack-logo.png" alt="ALPack" width="400"> </p> <h1 align="left">🚀 ALPack</h1>

aka Apptension Light Pack ;)

<h2 align="center">Welcome to our all-in-one solution for building efficient web applications using some of the hottest technologies right now!</h2> <p align="center"> <a href="https://github.com/apptension/alpack"> <img src="https://img.shields.io/github/v/release/apptension/alpack?style=for-the-badge" alt="Version"> </a> <a href="https://github.com/apptension/alpack"> <img src="https://img.shields.io/github/license/apptension/alpack?style=for-the-badge" alt="License"> </a> <a href="https://twitter.com/apptension"> <img src="https://img.shields.io/twitter/follow/apptension?style=for-the-badge&logo=twitter" alt="Follow Us on Twitter"> </a> <a href="https://discord.apptension.com"> <img src="https://img.shields.io/discord/1122849885335597088?style=for-the-badge&logo=discord" alt="Chat with us on Discord"> </a> </p>

🌟 Features

🔧 Tech Stack

We've handpicked the following stack for optimal performance, scalability, and developer experience:

🏗 Infrastructure

🚀 Getting Started

  1. Clone the repository.
  2. Generate Google OAuth credentials (default correct authorized URL should be set to: http://localhost:3000/api/auth/callback/google).
  3. Prepare .env and apps/app/.env files based on the .env.shared examples. Fill them with Google OAuth credentials.
  4. Install dependencies: pnpm install
  5. Create Docker container: docker volume create {PROJECT_NAME}-web-backend-db-data. PROJECT_NAME needs to be the same as set in .env file in step 3.
  6. Launch Docker: docker compose up -d
  7. Fire up the Next.js app: pnpm nx run app:serve
  8. Dive in! Visit https://localhost:3000 and start coding.

📂 Project Structure

.
├── ...
├── apps                    # Primary directory for Next.js apps
│   └── app                 # Main Next.js web application - landing page & application
├── packages                # Directory for shared packages
│   ├── api-client          # Apollo Client and FE schema configuration
│   ├── core                # Core components and providers
│   ├── emails              # React-email components
│   ├── graphql-api         # ORM models and GraphQL API schema
│   └── internal            # Internal packages directory
└── ...

⚙️ Commands

💌 Emails

Run local development server

:warning: Be aware that command below might fail for a first time in your pnpm workspace according to the react-email GitHub issue. To solve it you might need to run yarn install in the packages/emails/.react-email directory.

packages/emails > pnpm dev

🚀 Deployment

  1. Go to Vercel and create a team
  2. Create a Postgres Database storage. Make sure to use POSTGRES environment variables prefix.
  3. Create a project with:
    • Root directory set to: apps/app
    • Next.js set up as Framework preset
  4. Create a Google OAuth credentials with the correct redirect url (https://{VERCEL_DOMAIN}/api/auth/callback/google)
  5. Add environment variables to in the app Settings tab
  6. Assign the postgres storage to the project

🔗 Useful Documentation


🌍 Who are we?

We're Apptension, a team that turns ideas into world-class software using expertise in technology, design, and product management. We work with founders, investors, and creative agencies to help them bring uncommon ideas to the market.

Our partners value our outside-the-box thinking, clear and honest communication, and reliability – even in the most dynamic and time-compressed projects. Among our clients – plenty of early-stage startups, as well as international tech behemoths like Netflix and Uber. We live and breathe tech – and we're darn good at it.

To bring even more value to our partners, we create bespoke tools (like SaaS Boilerplate and ALPack), allowing us to shorten time-to-market while avoiding technical debt.

License

ALPack is licensed under the MIT License.

Contributing to ALPack project

We welcome contributions from anyone interested in improving ALPack. Please keep in mind that this project follows a Code of Conduct to ensure a welcoming community for all.

For more detailed information on how to contribute to this project, please refer to our Contributing Guide.

If you have any questions about contributing, please join our Discord server - we are happy to help you!

Thank you for considering contributing to ALPack!