Mastering Phoenix Framework - Part 2

Hi All,

This blog is dedicated to the directory structure for the Phoenix Framework application.

Checkout my previous blogs here, if you want to know more about Phoenix Framework Application.

Mastering Phoenix Framework - Introduction

Mastering Phoenix Framework - Part 1

Now, I think we should start with today's topic. Your Phoenix Framework application's directory structure looks similar to the one shown below.

Directory structure

/my_phoenix_app
├── /assets
│   ├── /js
│   ├── /css
│   └── /static
├── /config
│   ├── config.exs
│   ├── dev.exs
│   ├── prod.exs
│   └── test.exs
├── /deps
├── /lib
│   ├── /my_phoenix_app
│   └── /my_phoenix_app_web
│       ├── /controllers
│       ├── /templates
│       ├── /channels
│       ├── /views
│       ├── /live
│       ├── router.ex
│       └── endpoint.ex
├── /priv
│   ├── /static
│   └── /repo
├── /test
│   ├── /my_phoenix_app_web
│   └── /support
└── mix.exs

Let's take a detailed look at the directory structure.

1. /assets: Contains front-end assets like JavaScript, CSS, images, and other static files.

   • /js: JavaScript files.
   • /css: CSS files.
   • /static: Static files such as images.

2. /config: Configuration files for the application.

   • config.exs: Main configuration file.
   • dev.exs: Configuration specific to the development environment.
   • prod.exs: Configuration specific to the production environment.
   • test.exs: Configuration specific to the test environment.

3. /deps: Dependencies managed by Mix, Elixir's build tool.

4. /lib: The main directory for your application's code.

• /lib/my_phoenix_app: Your application code, including contexts and business logic.
• /lib/my_phoenix_app_web: The web interface of your application.
  • /controllers: Controllers handling HTTP requests and responses.
  • /templates: Templates for rendering HTML views.
  • /channels: WebSocket channels for real-time features.
  • /views: View modules that render templates.
  • /live: LiveView modules for real-time updates without JavaScript.
  • /router.ex: Defines routes for the application.
  • /endpoint.ex: Endpoint configuration for handling requests.

1. /priv: Contains private files used by the application.

   • /priv/static: Compiled static assets.
   • /priv/repo: Database-related files, including migrations and seeds.

2. /test: Test files for the application.

   • /test/my_phoenix_app_web: Tests for the web interface.
   • /test/support: Helper modules and configuration for tests.

3. mix.exs: The main build configuration file for the project.

That's it for the day. I hope you have enjoyed this blog. In the next part, we will go through some more concepts of the Phoenix framework.

If you have any suggestions/doubts, feel free to reach out via one of the following methods.

LinkedIn: https://www.linkedin.com/in/rushikesh-pandit/
GitHub: https://github.com/rushikeshpandit
Portfolio: https://www.rushikeshpandit.in

#myelixirstatus , #liveviewnative , #dockyard , #elixir , #phoenixframework