Setting up Your Phoenix Application - Part 1


Phoenix Elixir stutorial

Other articles in the series

  • Making our UI user friendly - Part 15
  • Deploying Phoenix VueJS application using Docker - Part 14
  • Fixing failing Elixir tests - Part 13
  • Adding new features to Order Management - Part 12
  • Add Order Management - Part 11
  • Refactoring and adding tests for Phoenix - Part 10
  • Refactoring VueJS with Typescript- Part 9
  • Add Customer Management - Part 8
  • Writing tests with Jest and Typescript - Part 7
  • Adding Vuex to Vue using Typescript - Part 6
  • Building our Homepage view component - Part 5
  • Add Multi-language support to Vue Typescript - Part 4
  • Generate Vue Typescript Application - Part 3
  • Setting up Models with Ecto and Adding Routing . Part 2
  • Setting up Your Phoenix Application - Part 1
  • Tutorial Series for building a VueJS (Typescript) and Phoenix(Elixir) Shop Management Application - Part 0

    • The back-end related code for this post is available here.

    Setting up Phoenix with Postgres

    Phoenix docs provides the complete tutorial to install elixir and phoenix framework. Go ahead and install it, I will wait. Once we have installed it, lets start a new phoenix project. Mix is the build tool that ships with Elixir. It provides tasks for performing various operations. Lets use mix to create a new project. We will name our project ms(Yeah why not :D).

    mix phx.new ms --no-html --no-webpack

    This will walk you through creating the project and installing the dependencies. Once it is finished, we will get back the prompt. Now lets import the generated project in to our IDE. I use the intellij IDEA along with intellij-elixir plugin. You can also use other editors. Import the project via File > Open > path to ms folder, where the mix.exs file is present. Once the project is imported, we look at the database connectivity. In order to know our database credentials we go ms/config/dev.exs.

    We need to setup our postgres with these credentials. Lets set it up using docker and postgres. Go ahead and install docker from here. Now we pull the postgres container and run it using the below command.

    docker run --rm --name md -p 5433:5432 -i -t -v /home/name/your-directory:/var/lib/postgresql/data -e POSTGRES_DB=ms_dev -e POSTGRES_PASSWORD=postgres  -e POSTGRES_USER=postgres postgres:latest

    As we see we pass the postgres username, password and database as environment variable to docker using -e flag. Now we need to create the ms_dev database and run the ecto migrations. For this, run the following commands.

    cd ms 
mix ecto.create # For creating database
mix ecto.migrate # To run migrations, we don't have any now though.
mix phx.server # Start the server

    Now your phoenix app is reachable at localhost:4000. At this point onwards, I expect a basic understanding of Elixir. For a quick overview, please read elixir in Y minutes. Other Phoenix / Elixir concepts will be explained as we progress. In the next part we will model and create our database tables using ecto.