[DEMO] Deploy a multi-app project with Bigfoot website, API Platform admin (ReactJS), Gatsby website and Mercure.rocks server on Upsun

Contribute, request a feature, or check out our resources

Join our community       Documentation       Blog       Report a bug       Request a feature

     

---

Contents

About       Getting started       Migrate       Learn       Contribute      

---

DISCLAIMER:
This is an example codebase to host a multiple applications project with Upsun.
This repo is used in this blogpost as a starting point for the users and is not meant to be updated along the way.

About

We have just created a new multi-app project for you, based on Bigfoot Project, API Platform Admin, Gatsby and Mercure.rocks server.
The generated code has been setup for a typical web multi-application project hosted on Upsun.

Features

• PHP 8.3
• PostgreSQL v15
• Composer-based build
• Yarn v1.22.17
• GO 1.21
• NodeJS v20
• Mercure.rocks server v0.14.4

Getting started

Local development

This section provides instructions for running the Bigfoot Multi-app Example locally, connected to a local database instance.

In all cases for developing with Upsun, it's important to develop on an isolated environment - do not connect to data on your production environment when developing locally.

Each of the options below assume that you have already deployed this template to Upsun, as well as the following starting commands:

1. Install the Upsun CLI

   Follow the instructions to install the Upsun CLI for your operating system. You can verify the installation by logging in (upsun login) and listing your projects (upsun project:list).

2. Find your PROJECT_ID by running the command upsun project:list

   +---------------+------------------------------------+------------------+---------------------------------+
   | ID            | Title                              | Region           | Organization                    |
   +---------------+------------------------------------+------------------+---------------------------------+
   | PROJECT_ID    | Your Project Name                  | xx-3.platform.sh | your-username                   |
   +---------------+------------------------------------+------------------+---------------------------------+

3. Get your Upsun project

   upsun get PROJECT_ID
   cd <PROJECT_FOLDER>
   

   or fork this repo if you don't have any existing project and then clone your own repo

   git clone git@github.com:<YOUR-ORGANIZATION>/bigfoot-multiapp-example.git bigfoot-multiapp
   cd bigfoot-multiapp
   

4. Start the API component:

   1. cd ./api

   2. Install Symfony CLI

   3. Start docker container for the database : docker-compose up -d

   4. symfony composer install

   5. check that your api/.env file contains a valid DATABASE_URL to let Symfony connect to your database

      DATABASE_HOST=127.0.0.1
      DATABASE_PORT=52947
      DATABASE_NAME=app
      DATABASE_USER=symfony
      DATABASE_PASSWORD=ChangeMe
      DATABASE_URL="postgresql://${DATABASE_USER}:${DATABASE_PASSWORD}@${DATABASE_HOST}:${DATABASE_PORT}/${DATABASE_NAME}?serverVersion=14&charset=utf8"
      

   6. symfony console doctrine:schema:create --dump-sql (use --force if there any SQL requests displayed)

   7. symfony server:start -d

   8. yarn install && yarn encore dev

   9. symfony open:local or you can go on https://localhost:8000/api

   Note: if symfony server does not start your app using default port 8000, please change REACT_APP_PUBLIC_URL from ./admin/.env file to reflect new port in use

5. Start Gatsby app in a new terminal tab

   1. Open a new terminal using CTRL+T (to be on the same root folder)

   2. cd ../gatsby

   3. Install Gatsby CLI

   4. Start Gatsby

   export SHARP_IGNORE_GLOBAL_LIBVIPS=true (optional if using a mac) 
   yarn
   NODE_TLS_REJECT_UNAUTHORIZED=0  gatsby develop -p 8080
   

   1. open http://localhost:8080/ in your browser

6. Start Mercure server locally in a new terminal tab

   1. Open a new terminal using CTRL+T (to be on the same root folder)

   2. cd ../mercure

   3. create docker Mercure.rocks container

      docker run \
          -e MERCURE_PUBLISHER_JWT_KEY='!ChangeThisMercureHubJWTSecretKey!' \
          -e MERCURE_SUBSCRIBER_JWT_KEY='!ChangeThisMercureHubJWTSecretKey!' \
          -p 8006:80 \
          -p 8007:443 \
          dunglas/mercure caddy run --config /etc/caddy/Caddyfile.dev

   4. open localhost:8007 in your browser

7. Start the ADMIN component in a new terminal tab

   1. cd ../admin (assuming that you were in the ./mercure folder)

   2. yarn install

   3. yarn start

   4. a new browser tab should be opened automatically with url http://localhost:3000

8. Create a new branch

   upsun branch new_branch
   

9. Develop your feature and commit it in GIT

10. Push your code to your environment (can be done multiple time)

    upsun push
    

11. Push to production

    upsun checkout main
    upsun merge new_branch
    

Note: For many of the steps above, you may need to include the CLI flags -p PROJECT_ID and -e ENVIRONMENT_ID if you are not in the project directory or if the environment is associated with an existing pull request.

Deploying to Upsun

This repository has all the code it needs in order to deploy to Upsun.

Deploy directly to Upsun from the command line

1. Create a free trial:

   Register for a 30 day free trial with Upsun. When you have completed signup, select the Create from scratch project option. Give you project a name, and select a region where you would like it to be deployed. As for the Production environment option, make sure to match it to this repository's settings, or to what you have updated the default branch to locally.

2. Install the Upsun CLI

   Follow the instructions to install the Upsun CLI for your operating system. You can verify the installation by logging in (upsun login) and listing your projects (upsun project:list).

3. Set the project remote

   Find your PROJECT_ID by running the command upsun project:list

   +---------------+------------------------------------+------------------+---------------------------------+
   | ID            | Title                              | Region           | Organization                    |
   +---------------+------------------------------------+------------------+---------------------------------+
   | PROJECT_ID    | Your Project Name                  | xx-5.platform.sh | your-username                   |
   +---------------+------------------------------------+------------------+---------------------------------+

   Then from within your local copy, run the command upsun project:set-remote PROJECT_ID.

4. Push using git

   git push upsun DEFAULT_BRANCH

5. or Push using Upsun CLI

   upsun push

Integrate with a GitHub repo and deploy pull requests

1. Create a free trial:

   Register for a 30 day free trial with Upsun. When you have completed signup, select the Create from scratch project option. Give you project a name, and select a region where you would like it to be deployed. As for the Production environment option, make sure to match it to whatever you have set at https://YOUR_NAMESPACE/nextjs-drupal.

2. Install the Upsun CLI

   Follow the instructions to install the Upsun CLI for your operating system. You can verify the installation by logging in (upsun login) and listing your projects (upsun project:list).

3. Setup the integration:

   Consult the GitHub integration documentation to finish connecting your repository to a project on Upsun. You will need to create an Access token on GitHub to do so.

4. Then, just use regular GIT commands to push your code to your repository. It will automatically update your corresponding Upsun environment

Integrate with a GitLab repo and deploy merge requests

1. Create a free trial:

   Register for a 30 day free trial with Upsun. When you have completed signup, select the Create from scratch project option. Give you project a name, and select a region where you would like it to be deployed. As for the Production environment option, make sure to match it to this repository's settings, or to what you have updated the default branch to locally.

2. Install the Upsun CLI

   Follow the instructions to install the Upsun CLI for your operating system. You can verify the installation by logging in (upsun login) and listing your projects (upsun project:list).

3. Create the repository

   Create a new repository on GitLab, set it as a new remote for your local copy, and push to the default branch.

4. Setup the integration:

   Consult the GitLab integration documentation to finish connecting a repository to a project on Upsun. You will need to create an Access token on GitLab to do so.

5. Then, just use regular GIT commands to push your code to your repository. It will automatically update your corresponding Upsun environment

Integrate with a Bitbucket repo and deploy pull requests

1. Create a free trial:

   Register for a 30 day free trial with Upsun. When you have completed signup, select the Create from scratch project option. Give you project a name, and select a region where you would like it to be deployed. As for the Production environment option, make sure to match it to this repository's settings, or to what you have updated the default branch to locally.

2. Install the Upsun CLI

   Follow the instructions to install the Upsun CLI for your operating system. You can verify the installation by logging in (upsun login) and listing your projects (upsun project:list).

3. Create the repository

   Create a new repository on Bitbucket, set it as a new remote for your local copy, and push to the default branch.

4. Setup the integration:

   Consult the Bitbucket integration documentation to finish connecting a repository to a project on Upsun. You will need to create an Access token on Bitbucket to do so.

5. Then, just use regular GIT commands to push your code to your repository. It will automatically update your corresponding Upsun environment

Migrating your data

If you are moving an existing site to Upsun, then in addition to code you also need to migrate your data. That means your database and your files.

Importing the database

First, obtain a database dump from your current site and save your dump file as database.sql. Then, import the database into your Upsun site using the CLI:

upsun sql -e main < database.sql

Importing files

You first need to download your files from your current hosting environment. The easiest way is likely with rsync, but consult your old host's documentation.

The upsun mount:upload command provides a straightforward way to upload an entire directory to your site at once to a mount defined in a .upsun/config.yaml file. Under the hood, it uses an SSH tunnel and rsync, so it is as efficient as possible. (There is also a upsun mount:download command you can use to download files later.) Run the following from your local Git repository root (modifying the --source path if needed and setting BRANCH_NAME to the branch you are using).

A few examples are listed below, but repeat for all directories that contain data you would like to migrate.

upsun mount:upload -e main --mount web/sites/default/files --source ./web/sites/default/files
upsun mount:upload -e main --mount private --source ./private

Note that rsync is picky about its trailing slashes, so be sure to include those.

With your application now deployed on Upsun, things get more interesting. Run the command upsun environment:branch new-feature for your project, or open a trivial pull request off of your current branch.

The resulting environment is an exact copy of production (or corresponding parent environment). It contains identical infrastructure to what's been defined in your configuration files, and even includes data copied from your production environment in its services. On this isolated environment, you're free to make any changes to your application you need to, and really test how they will behave on production.

After that, here are a collection of additional resources you might find interesting as you continue with your migration to Upsun:

• Troubleshooting
• Adding a domain and going live
• (CDN) Content Delivery Networks
• Performance and observability with Blackfire.io
• Pricing
• Security and compliance

Learn

Troubleshooting

Accessing logs

After the environment has finished its deployment, you can investigate issues that occured on startup, deploy and post_deploy hooks, and generally at runtime using the CLI. Run the command:

upsun ssh

If you are running the command outside a local copy of the project, you will need to include the -p (project) and/or -e (environment) flags as well. Once you have connected to the container, logs are available within /var/log/ for you to investigate.

Rebuilding cache

You may run into a database error after installing Symfony on your production environment initially. To fix, SSH into the api application container (upsun ssh) and rebuild the cache using Symfony console:

php bin/console cache:clear
php bin/console cache:pool:clear cache.app

Blackfire.io: creating a Continuous Observability Strategy

This template includes a starting .blackfire.yml file that can be used to enable Application Performance Monitoring, Profiling, Builds and Performance Testing on your project. Upsun comes with Blackfire pre-installed on application containers, and setting up requires minimal configuration.

• What is Blackfire?
• Configuring Blackfire.io on a Upsun project
• Blackfire.io Upsun documentation
• Profiling Cookbooks
• Monitoring Cookbooks
• Testing Cookbooks
• Using Builds
• Configuring Integrations

Resources

• API Platform

• Upsun PHP documentation

Contact

This template is maintained by the Upsun Developer Relations team, and they will be notified of all issues and pull requests you open here.

• Discord: If you haven't done so already, you can join Upsun's community on Discord channels and ping the @devrel_team with any questions.

About Upsun

This template has been specifically designed to deploy on Upsun.

What is Upsun?

Upsun is a unified, secure, enterprise-grade platform for building, running and scaling web applications. We’re the leader in Fleet Ops: Everything you need to manage your fleet of websites and apps is available from the start. Because infrastructure and workflows are handled from the start, apps just work, so teams can focus on what really matters: making faster changes, collaborating confidently, and scaling responsibly. Whether managing a fleet of ten or ten thousand sites and apps, Upsun is the Developer- preferred solution that scales right.

Our key features include:

• GitOps: Git as the source of truth

  Every branch becomes a development environment, and nothing can change without a commit.

• Batteries included: Managed infrastructure

  Simple abstraction in YAML for committing and configuring infrastructure, fully managed patch updates, and 24 runtimes & services that can be added with a single line of code.

• Instant cloning: Branch, merge, repeat

  Reusable builds and automatically inherited production data provide true staging environments - experiment in isolation, test, then destroy or merge.

• FleetOps: Fleet management platform

  Leverage our public API along with custom tools like Source Operations and Activity Scripts to manage thousands of applications - their dependency updates, fresh content, and upstream code.

Contribute

Help us keep top-notch templates!

Every one of our templates is open source, and they're important resources for users trying to deploy to Upsun for the first time or better understand the platform. They act as getting started guides, but also contain a number of helpful tips and best practices when working with certain languages and frameworks.

See something that's wrong with this template that needs to be fixed? Something in the documentation unclear or missing? Let us know!

How to contribute

Report a bug       Submit a feature request       Open a pull request      

Need help?

Join us on Discord

Thanks to all of our amazing contributors!

Made with contrib.rocks