Phoenix from Scratch

Part of what makes nanobox so useful is you don’t even need Elixir or Phoenix installed on your local machine to use them.

Create a Phoenix project

Create a project folder and change into it:

mkdir nanobox-phoenix && cd nanobox-phoenix

HEADS UP: All nanobox commands must be run from within your project folder.

Add a boxfile.yml

Nanobox uses a boxfile.yml to configure your app’s environment.

At the root of your project create a boxfile.yml telling Nanobox you want to use the Elixir engine. You’ll also want to add inotify-tools as a development package so it’ll be available in your local dev environment:

run.config:
  # elixir runtime
  engine: elixir

  # we need nodejs in development
  # ensure inotify exists for hot-code reloading
  dev_packages:
    - nodejs
    - inotify-tools

  # cache node_modules
  cache_dirs:
    - node_modules

  # add node_module bins to the $PATH
  extra_path_dirs:
    - node_modules/.bin

  # enable the filesystem watcher
  fs_watch: true

# add postgres as a data component
data.db:
  image: nanobox/postgresql

NOTE: In the proceeding boxfile.yml, Nanobox is told to include nodejs and run a postgres database as this is the most common configuration. Feel free to modify your configuration for your specific needs.

Generate a Phoenix App

# drop into a nanobox console
nanobox run

# install Phoenix
# Phoenix Framework 1.2
mix archive.install https://github.com/phoenixframework/archives/raw/master/phoenix_new.ez

# Phoenix Framework 1.3
mix archive.install https://github.com/phoenixframework/archives/raw/master/phx_new.ez

# generate our new phoenix application

# cd into the /tmp dir to create an app
cd /tmp

# generate the phoenix app (Use your own app name)

# Phoenix Framework 1.2
mix phoenix.new app (Do not fetch dependencies at this moment)

# Phoenix Framework 1.3
mix phx.new app (Do not fetch dependencies at this moment)

# cd back into the /app dir
cd /app

# copy the generated app into the project
cp -a /tmp/app/* .

# exit the console
exit

Configure Phoenix

Modify the config/dev.exs and config/test.exs

If your app is using a database, you’ll need to modify the config to use environment variables generated by Nanobox:

Go to your project folder and modify the file: config/dev.exs as follows:

# Configure your database
config :app, App.Repo,
  adapter: Ecto.Adapters.Postgres,
  username: System.get_env("DATA_DB_USER"),
  password: System.get_env("DATA_DB_PASS"),
  hostname: System.get_env("DATA_DB_HOST"),
  database: "app_dev",
  pool_size: 10

Go to your project folder and modify the file: config/test.exs as follows:

# Configure your database
config :app, App.Repo,
  adapter: Ecto.Adapters.Postgres,
  username: System.get_env("DATA_DB_USER"),
  password: System.get_env("DATA_DB_PASS"),
  hostname: System.get_env("DATA_DB_HOST"),
  database: "app_test",
  pool_size: 10

Install NPM

In your desktop, got to your project folder

nanobox run
cd assets && npm install

Still at the nanobox console, lets create and migrate the Database

cd /app
mix ecto.create

Fetch your Dependencies

Inside of your Nanobox console, fetch your app’s dependencies:

mix deps.get

Lets exit the nanobox console

exit

Run the app

In your desktop, got to your project folder

Phoenix Framework 1.2

nanobox run mix phoenix.server

Phoenix Framework 1.3

nanobox run mix phx.server

Lets add a DNS record to access your applications

In your desktop, got to your project folder

nanobox dns add local phoenix.local

Visit your app at phoenix.local:4000

Explore

With Nanobox, you have everything you need develop and run your Phoenix app:

# drop into a Nanobox console
nanobox run

# where elixir is installed
elixir -v

# your packages are available
mix list

# and your code is mounted
ls

# exit the console
exit

Now what?

Whats next? Think about what else your app might need and hopefully the topics below will help you get started with the next steps of your development!