phoenix-ng

Phoenix application

• Build and run
• Components
• Event display
• Development flow
• Deploy the application
  • Deploy with a specific event

Build and run

This is an Angular application, so you will need to have Node.js and Angular CLI installed locally.

You can follow this guide to set up your local environment.

Once everything is set up, run ng serve from the command line in the project directory for a dev server. Then navigate to http://localhost:4200/ from your browser.
The app will automatically reload if you change any of the source files.

Components

This application uses components from the phoenix-ui-components package.

Event display

This application uses the phoenix-event-display package (source) for all event display functionality.

Development flow

The source code of packages phoenix-event-display and phoenix-ui-components is linked to this application (phoenix-ng) through TypeScript configuration. So running this application in development mode (yarn start) and making any changes to either of the packages will rebuild and hot reload the application.

Deploy the application

In order to make a version of Phoenix which can be deployed to your server, from the packages/phoenix-ng directory, run the following command:

yarn deploy:web

You can then copy the files generated in ./docs to your server e.g. with:

rsync -avz docs/ your-server.net:path/to/website

Deploy with a specific event

Phoenix can also be deployed as a single page application with a specific event. To do that.

1. Copy the event data to ./projects/phoenix-app/src/assets (or you can use a URL instead)
2. Specify the event data type and file path (or URL) in ./projects/phoenix-app/event-config.json
3. Lastly, in the packages/phoenix-ng directory, run the command: yarn deploy:web:single

The deployed application will be in ./docs which can be copied directly to a server.