How to convert Old project structure to New project structure? mix

My old Application structure

New scaffold, phoenix app

Hello Everyone,
I am coming from old version of phoenix which 1.4.2-1.5 something. Thought to move to the latest version of phoenix 1.7.7. After scaffolding new phoenix project , the project structure drastically improved. Though I have went through Change logs and understand heex and live components, How can start to start to move to this new project structure?

In the new scaffold
The View in AppWeb.ex is completely missing view

 def view do
    quote do
      use Phoenix.View, root: "lib/rumbl_web/templates", namespace: RumblWeb

  • there is no view or templates. I find it difficult to grasp the new layout.
    If some one can explain it will be really helpful.

From what I know there is not automated way of doing this. But this tool will help you find what has changed from phoenix version to version.

I would work from the starting version and walk all the way up procedurally from version to version till you get to the version you want.

Also read the changelogs in phoenix too.

1 Like

I have gone through change log from 1.5 to 1.7.7. It didnt help me, also tried upgrade guides.This new structure is I am not familiar with

Did you happen to read this?

Note section: (optional) Migrate from Phoenix.View to Phoenix.Component all the way at the bottom



That’s kinda expected. Generally it’s not expected for people to update existing projects to new conventions given things are still fully backwards compatible.

I first read that as if they walked all the way up to 1.7.7 but now I wonder if they just jumped from 1.5 to 1.7 via the diff in which case that would be too much all at once.

1 Like

Yes I went through change log from 1.5.1 , 1.5.2 … … ,and after reading that I moved directly to 1.7.7. It was lot of changes. there I found , there was no backward compatibility, you need to rename templates to .heex, otherwise throws errors/render fx dont work. and dynamic html attribute value to wrapped around {“#{}”}. And conversion to functional component.And correcting <%= %> dynamic expression to {} for html attribute.added phoenix view,