Skip to content

Instantly share code, notes, and snippets.

@chrismccord
Last active August 29, 2015 14:26
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save chrismccord/969d75d1562979a3ae37 to your computer and use it in GitHub Desktop.
Save chrismccord/969d75d1562979a3ae37 to your computer and use it in GitHub Desktop.
Phoenix 0.15.x to 0.16.0 upgrade instructions

Phoenix dep

Update your phoenix dep:

def deps do
 [...,
  {:phoenix, "~> 0.16"},
  ...]
end

Then run mix deps.update phoenix

Router, secure browser headers

We have enhanced security by setting secure browser headers. Add it to the bottom of your :browser pipeline:

  pipeline :browser do
    ...
    plug :put_secure_browser_headers
  end

Controllers

  • controller_template/1 has been renamed to view_template/1
  • jsonp/3 function has been removed in favor of the plug :allow_jsonp

Views

render_one and render_many no longer inflect the view module from the model in favor of explicitly passing the view

0.15.x:

render_one user, "show.html"

0.16.0:

render_one user, UserView, "show.html"

Channels

transport :origins options has been renamed to :check_origin:

If you are using this option, just rename origins: to check_origin:. If you don't know what this option is, simply ignore :)

phoenix.js channels client

socket.chan has been renamed to socket.channel:

0.15.x:

let channel = socket.chan("rooms:123")

0.16.0:

let channel = socket.channel("rooms:123")

Socket params have moved from the Socket constructor to the connect funnction:

0.15.x:

let socket = new Socket("/socket", {params: {userToken: token})
socket.connect()

0.16.0:

let socket = new Socket("/socket")
socket.connect({userToken: token})

Note: Socket params are no longer merged as default params for channel params. Use connect/2 on the server to wire up default channel assigns.

Next, Replace your web/static/vendor/phoenix.js with the new client https://raw.githubusercontent.com/phoenixframework/phoenix/38c0d328be429fb8eda3ab428478b78d3ecef002/priv/static/phoenix.js OR move to the optional update to pull phoenix.js direclty from your phoenix dep (below):

Update brunch-config.js to pull phoenix.js and phoenix_html.js from phoenix deps (Optional)

New applications pull phoenix.js and phoenix_html.js direclty from your local phoenix dep, allowing you to get upgrades whenever they come. To enable this change in your app, delete your web/static/vendor/phoenix.js file and update your brunch config:

brunch-config.js, update your paths: config to include phoenix deps:

  paths: {
    // Dependencies and current project directories to watch
    watched: ["deps/phoenix/web/static",
              "deps/phoenix_html/web/static",
              "web/static", "test/static"],

    // Where to compile files to
    public: "priv/static"
  },

Then import the channels client and phoenix_html into your web/static/js/app.js:

import {Socket} from "deps/phoenix/web/static/js/phoenix"
import "deps/phoenix_html/web/static/js/phoenix_html"

Update your :phoenix_html dep to ~> 2.0 in mix.exs:

def deps do
 [...,
  {:phoenix_html, "~> 2.0"},
  ...]
end

Then run mix deps.update phoenix_html and restart your server to rebuild your app.js bundle.

If not using brunch (or you skipped the above step), vendor phoenix_html.js is your asset building pipeline

We no longer use obtrusive javascript in the phoenix_html project to handle our link .., method: click events. For brunch users, this is taken care of by the above step. For everyone else, vendor https://raw.githubusercontent.com/phoenixframework/phoenix_html/bc208c5437bbf0177ebe6770cc55e5e31ba04e22/priv/static/phoenix_html.js in your asset builder.

Use brunch's new autoRequire feature (optional):

Brunch has a new autoRequire feature allowing you to ditch the <script>require("web/static/js/app")</script> in your layout, which bootstraps your js app. To use the new feature, first remote the above line from your web/templates/layout/app.html.eex, then upgrade your npm brunch dependency in package.json:

  "dependencies": {
    "brunch": "^1.8.5",
    ...
  }

Then update your brunch-config.js to use the new autoRequire option:

  modules: {
    autoRequire: {
      'js/app.js': ['web/static/js/app']
    }
  },

Next, update your bruch watcher config in config/dev.exs to pass the newly required --stdin flag:

watchers: [node: ["node_modules/brunch/bin/brunch", "watch", "--stdin"]]

Lastly run $ npm install to pull down the new brunch and restart your server to rebuild your app.js bundle.

Phoenix Live Reload

Update :phoenix_live_reload to the latest versioN:

def deps do
  [...
   {:phoenix_live_reload, "~> 0.6"},
  ..]
end
@felipesere
Copy link

Live reload needs to updated as it still uses let channel = socket.chan("rooms:123") in v0.5.2:
https://github.com/phoenixframework/phoenix_live_reload/blob/master/priv/static/phoenix_live_reload.js#L47

@gernotkogler
Copy link

Why was phoenix_haml not bumped as well? I was hoping that haml would become the default template language for phoenix, would imho match the noise free syntax of elixir / phoenix beautifully.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment