Elixir/Phoenix VSCode snippets

7 months ago

Here's my current Elixir VSCode snippets elixir.json file.

You can add it to VSCode by Ctrl/Cmd+Shift+P and choosing Preferences : Configure User Snippets, then opening elixir.json. If you don't have one yet, you can create a new snippet file in the same place.

Supported snippets:

  • gs: GenServer
  • gscast: GenServer Cast Function
  • gscall: GenServer Call Function
  • lv: Phoenix LiveView
  • lvc: Phoenix LiveComponent
  • lvhe: Phoenix LiveView Handle Event Function
  • lvhi: Phoenix LiveView Handle Info Function

Hope that's useful, here's the file:

{
    "My GenServer": {
        "prefix": "gs",
        "body": [
            "defmodule ${4:package}.${1:name} do",
            "\tuse GenServer",
            "\trequire Logger",
            "",
            "\t@me __MODULE__",
            "",
            "\tdef start_link(${2:opts}) do",
            "\t\t{:ok, pid} = result = GenServer.start_link(@me, ${2:opts}, name: @me)",
            "\t\tLogger.debug(\"#{@me} GenServer started with# #{inspect(pid)}.\")",
            "\t\tresult",
            "\tend",
            "",
            "\tdef init(${3:initial_state}) do",
            "\t\t{:ok, ${3:initial_state}}",
            "\tend",
            "",
            "\t$0",
            "end"
        ],
        "description": "My GenServer"
    },
    "GenServer Cast": {
        "prefix": "gscast",
        "body": [
            "def ${1:function}() do",
            "\tGenServer.cast(@me, :${1:function})",
            "end",
            "",
            "${0}"
        ],
        "description": "GenServer cast function"
    },
    "GenServer Call": {
        "prefix": "gscall",
        "body": [
            "def ${1:function}() do",
            "\tGenServer.call(@me, :${1:function})",
            "end",
            "",
            "${0}"
        ],
        "description": "GenServer call function"
    },
    "LiveViewLiveComponent": {
        "prefix": "lvc",
        "body": [
            "defmodule ${1:module} do",
            "\t@moduledoc \"\"\"",
            "\t${2:module_doc}",
            "\t\"\"\"",
            "\tuse Phoenix.LiveComponent",
            "",
            "\t@impl true",
            "\tdef update(_assigns, socket) do",
            "\t\t{:ok, socket}",
            "\tend",
            "",
            "\t@impl true",
            "\tdef render(assigns) do",
            "\t\t~L\"\"\"",
            "\t\t${0}",
            "\t\t\"\"\"",
            "\tend",
            "end",
        ]
    },
    "LiveView": {
        "prefix": "lv",
        "body": [
            "defmodule ${1:module} do",
            "\t@moduledoc \"\"\"",
            "\t${2:module_doc}",
            "\t\"\"\"",
            "\tuse Phoenix.LiveView",
            "",
            "\t@impl true",
            "\tdef mount(_params, _session, socket) do",
            "\t\t{:ok, socket}",
            "\tend",
            "",
            "\t@impl true",
            "\tdef handle_params(_params, _url, socket) do",
            "\t\t{:noreply, socket}",
            "\tend",
            "",
            "\t@impl true",
            "\tdef render(assigns) do",
            "\t\t~L\"\"\"",
            "\t\t${0}",
            "\t\t\"\"\"",
            "\tend",
            "end",
        ]
    },
    "LiveViewHandleEvent": {
        "prefix": "lvhe",
        "body": [
            "@impl true",
            "def handle_event(\"${1:event}\", %{\"${2:var}\" => ${2:var}} = _event, socket) do",
            "\t${0}",
            "\t{:noreply, socket}",
            "end"
        ]
    },
    "LiveViewHandleInfo": {
        "prefix": "lvhi",
        "body": [
            "@impl true",
            "def handle_info(${1:event}, socket) do",
            "\t${0}",
            "\t{:noreply, socket}",
            "end"
        ]
    }
}

Happy Elixir'ing