ðĶ Web development with Elixir
Last updated
Last updated
Web development has become a growing area that Elixir has begun to shine. This is in part thanks to the Phoenix framework created by Chris McCord that has made web development very hassle free with Elixir.
Heroku x Elixir Heroku was one of the companies that adopted Elixir and Phoenix for web development of one of their core analytics dashboard and internal systems. What they had noticed from using Elixir was that their systems were able to handle higher loads while maintaining a high response time.
Phoenix is a server-side framework designed for building web applications with Elixir. It was first created by Chris McCord and modeled after the Ruby on Rails framework.
It is a server-side framework, which means that all of the computation is performed on the server and sent to the client to render. Phoenix implements the Model-View-Controller (MVC) pattern:
You can build both your frontend and backend with Phoenix. The frontend of Phoenix is written as .heex files which is Phoenix's template language that embeds Elixir into HTML. The backend of Phoenix uses Plug.
As mentioned in the beginning of the guide, this guide does not attempt to provide a comprehensive introduction to the Phoenix framework. There are many nuances to how Phoenix can be used and you should refer to the official documentation if you are interested in learning more about Phoenix.
This guide will provide an introduction to Phoenix by getting you to build a to-do list application with some basic data persistence using SQLite3 (we are using a local database to reduce the amount of setup required to following along).
This guide will cover both base Phoenix and Phoenix LiveView. The reason for covering base Phoenix is to provide a firm foundation on the terminology before discussing slightly more advanced concepts in LiveView.
The following is the content structure of this guide:
Directory structure of Phoenix projects
Request lifecycle
Representing to-do items in Elixir
Anatomy of routers
Creating a new HTTP endpoint
Rendering the to-do list
Introduction to LiveView
Adding more actions to to-do list
Persisting data with Ecto and SQLite3
If you are watching the recorded series or attending the live event, the last part of persisting data may not be covered depending on time constraint. Do give the chapter a read if you have time as data persistence is a big component of working with web applications!
To get started with using web development using Elixir and Phoenix, we will start by installing the Phoenix CLI archive on your machine:
Then, you can create a new Phoenix project with the necessary boilerplate:
You may be prompted on whether you want to fetch the dependencies, agree to that option.
Then, navigate to the new folder:
Then, create the database. Phoenix uses a very popular Elixir library, Ecto for performing database queries and mapping:
Finally, you can run the demo application:
You should see the following show up at http://localhost:4000
If you want to view the full codebase without running each command, refer to this repository instead.
