├── .dockerignore ├── .formatter.exs ├── .gitignore ├── .tool-versions ├── Dockerfile ├── README.md ├── apps ├── hello │ ├── .formatter.exs │ ├── .gitignore │ ├── README.md │ ├── lib │ │ ├── hello.ex │ │ └── hello │ │ │ ├── application.ex │ │ │ ├── mailer.ex │ │ │ └── repo.ex │ ├── mix.exs │ ├── priv │ │ └── repo │ │ │ ├── migrations │ │ │ └── .formatter.exs │ │ │ └── seeds.exs │ └── test │ │ ├── support │ │ └── data_case.ex │ │ └── test_helper.exs └── hello_web │ ├── .formatter.exs │ ├── .gitignore │ ├── README.md │ ├── assets │ ├── css │ │ ├── app.css │ │ └── phoenix.css │ ├── js │ │ ├── app.jsx │ │ └── greeter.tsx │ ├── package-lock.json │ ├── package.json │ └── vendor │ │ └── topbar.js │ ├── lib │ ├── hello_web.ex │ └── hello_web │ │ ├── application.ex │ │ ├── controllers │ │ └── page_controller.ex │ │ ├── endpoint.ex │ │ ├── gettext.ex │ │ ├── release.ex │ │ ├── router.ex │ │ ├── telemetry.ex │ │ ├── templates │ │ ├── layout │ │ │ ├── app.html.heex │ │ │ ├── live.html.heex │ │ │ └── root.html.heex │ │ └── page │ │ │ └── index.html.heex │ │ └── views │ │ ├── error_helpers.ex │ │ ├── error_view.ex │ │ ├── layout_view.ex │ │ └── page_view.ex │ ├── mix.exs │ ├── priv │ ├── gettext │ │ ├── en │ │ │ └── LC_MESSAGES │ │ │ │ └── errors.po │ │ └── errors.pot │ └── static │ │ ├── favicon.ico │ │ ├── images │ │ └── phoenix.png │ │ └── robots.txt │ ├── rel │ └── overlays │ │ └── bin │ │ ├── migrate │ │ ├── migrate.bat │ │ ├── server │ │ └── server.bat │ └── test │ ├── hello_web │ ├── controllers │ │ └── page_controller_test.exs │ └── views │ │ ├── error_view_test.exs │ │ ├── layout_view_test.exs │ │ └── page_view_test.exs │ ├── support │ ├── channel_case.ex │ └── conn_case.ex │ └── test_helper.exs ├── config ├── config.exs ├── dev.exs ├── prod.exs ├── runtime.exs └── test.exs ├── docker-compose.yml ├── mix.exs └── mix.lock /.dockerignore: -------------------------------------------------------------------------------- 1 | .dockerignore 2 | Dockcerfile 3 | 4 | # there are valid reasons to keep the .git, namely so that you can get the 5 | # current commit hash 6 | .git/ 7 | .gitignore 8 | 9 | .log 10 | tmp 11 | 12 | # Mix artifacts 13 | _build 14 | deps 15 | *.ez 16 | releases 17 | 18 | # Generate on crash by the VM 19 | erl_crash.dump 20 | 21 | # Static artifacts 22 | node_modules 23 | -------------------------------------------------------------------------------- /.formatter.exs: -------------------------------------------------------------------------------- 1 | [ 2 | inputs: ["mix.exs", "config/*.exs"], 3 | subdirectories: ["apps/*"] 4 | ] 5 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # The directory Mix will write compiled artifacts to. 2 | /_build/ 3 | 4 | # If you run "mix test --cover", coverage assets end up here. 5 | /cover/ 6 | 7 | # The directory Mix downloads your dependencies sources to. 8 | /deps/ 9 | 10 | # Where 3rd-party dependencies like ExDoc output generated docs. 11 | /doc/ 12 | 13 | # Ignore .fetch files in case you like to edit your project deps locally. 14 | /.fetch 15 | 16 | # If the VM crashes, it generates a dump, let's ignore it too. 17 | erl_crash.dump 18 | 19 | # Also ignore archive artifacts (built via "mix archive.build"). 20 | *.ez 21 | 22 | # Temporary files, for example, from tests. 23 | /tmp 24 | 25 | 26 | -------------------------------------------------------------------------------- /.tool-versions: -------------------------------------------------------------------------------- 1 | erlang 24.2 2 | elixir 1.13.1 3 | -------------------------------------------------------------------------------- /Dockerfile: -------------------------------------------------------------------------------- 1 | # Find eligible builder and runner images on Docker Hub. We use Ubuntu/Debian instead of 2 | # Alpine to avoid DNS resolution issues in production. 3 | # 4 | # https://hub.docker.com/r/hexpm/elixir/tags?page=1&name=ubuntu 5 | # https://hub.docker.com/_/ubuntu?tab=tags 6 | # 7 | # 8 | # This file is based on these images: 9 | # 10 | # - https://hub.docker.com/r/hexpm/elixir/tags - for the build image 11 | # - https://hub.docker.com/_/debian?tab=tags&page=1&name=bullseye-20210902-slim - for the release image 12 | # - https://pkgs.org/ - resource for finding needed packages 13 | # - Ex: hexpm/elixir:1.13.1-erlang-24.2-debian-bullseye-20210902-slim 14 | # 15 | ARG BUILDER_IMAGE="hexpm/elixir:1.13.1-erlang-24.2-debian-bullseye-20210902-slim" 16 | ARG RUNNER_IMAGE="debian:bullseye-20210902-slim" 17 | 18 | FROM ${BUILDER_IMAGE} as builder 19 | 20 | # install build dependencies 21 | RUN apt-get update -y && apt-get install -y build-essential git npm \ 22 | && apt-get clean && rm -f /var/lib/apt/lists/*_* 23 | 24 | # prepare build dir 25 | WORKDIR /app 26 | 27 | # install hex + rebar 28 | RUN mix local.hex --force && \ 29 | mix local.rebar --force 30 | 31 | # set build ENV 32 | ENV MIX_ENV="prod" 33 | 34 | # install mix dependencies 35 | COPY mix.exs mix.lock ./ 36 | 37 | # copy apps/**/mix.exs 38 | COPY apps/hello/mix.exs ./apps/hello/mix.exs 39 | COPY apps/hello_web/mix.exs ./apps/hello_web/mix.exs 40 | 41 | RUN mix deps.get --only $MIX_ENV 42 | RUN mkdir config 43 | 44 | # copy compile-time config files before we compile dependencies 45 | # to ensure any relevant config change will trigger the dependencies 46 | # to be re-compiled. 47 | COPY config/config.exs config/${MIX_ENV}.exs config/ 48 | RUN mix deps.compile 49 | 50 | COPY apps/hello_web/priv apps/hello_web/priv 51 | 52 | # note: if your project uses a tool like https://purgecss.com/, 53 | # which customizes asset compilation based on what it finds in 54 | # your Elixir templates, you will need to move the asset compilation 55 | # step down so that `lib` is available. 56 | COPY apps/hello_web/assets apps/hello_web/assets 57 | 58 | # compile assets 59 | RUN cd apps/hello_web && mix assets.deploy 60 | 61 | # Compile the release 62 | COPY apps apps 63 | 64 | RUN mix compile 65 | 66 | # Changes to config/runtime.exs don't require recompiling the code 67 | COPY config/runtime.exs config/ 68 | 69 | COPY rel rel 70 | RUN mix release 71 | 72 | # start a new build stage so that the final image will only contain 73 | # the compiled release and other runtime necessities 74 | FROM ${RUNNER_IMAGE} 75 | 76 | RUN apt-get update -y && apt-get install -y libstdc++6 openssl libncurses5 locales \ 77 | && apt-get clean && rm -f /var/lib/apt/lists/*_* 78 | 79 | # Set the locale 80 | RUN sed -i '/en_US.UTF-8/s/^# //g' /etc/locale.gen && locale-gen 81 | 82 | ENV LANG en_US.UTF-8 83 | ENV LANGUAGE en_US:en 84 | ENV LC_ALL en_US.UTF-8 85 | 86 | WORKDIR "/app" 87 | RUN chown nobody /app 88 | 89 | # Only copy the final release from the build stage 90 | COPY --from=builder --chown=nobody:root /app/_build/prod/rel/hello_umbrella ./ 91 | 92 | USER nobody 93 | 94 | ENTRYPOINT [ "/app/bin/hello_umbrella" ] 95 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | Phoenix 1.6 with TypeScript & React 2 | === 3 | 4 | **Elixir, Phoenix, TypeScript, and React – the 2022 Edition** 5 | 6 | > This is the 2022 update to my earlier [article](https://medium.com/@alistairisrael/elixir-phoenix-typescript-and-react-2020-edition-32ceb753705). The source code to that still lives in this repository under the (detached) [`2020`](https://github.com/aisrael/elixir-phoenix-typescript-react/tree/2020) branch. 7 | > 8 | > This is the accompanying source code to my article [TypeScript & React with Phoenix 1.6](https://medium.com/@alistairisrael/phoenix-1-6-with-typescript-react-bea7f3a792d5) on Medium.com. 9 | 10 | --- 11 | 12 | The release of [Phoenix 1.6](https://www.phoenixframework.org/blog/phoenix-1.6-released) brings with it a couple of notable improvements, such as HEEx templating. To me, though, the most remarkable thing that improves developer experience was dropping webpack and node in favor of [esbuild](https://github.com/evanw/esbuild). 13 | 14 | Not only does esbuild promise faster build times, it supports TypeScript _out of the box_, and adding React isn't that much harder! 15 | 16 | The entire process has become so streamlined that in this article we can skip entire sections from its predecessors! 17 | 18 | With that out of way, let's go ahead and setup Elixir and Phoenix 1.6 with TypeScript and React. 19 | 20 | ### Prerequisites 21 | 22 | This guide assumes you already have the following set up: 23 | 24 | - **Erlang** (24.2+) 25 | - **Elixir** (1.13+) 26 | - **npm** (7.6.0 as of this writing) 27 | - **git** 28 | - **Docker** with **Docker Compose** (for running PostgreSQL) 29 | 30 | On macOS, the easiest way to get started is to install [Homebrew](https://brew.sh/), then use Homebrew to install Node, Git, Docker, and [asdf](https://asdf-vm.com/). 31 | 32 | We can then use `asdf` to install both Erlang and Elixir: 33 | 34 | ``` 35 | $ asdf plugin add erlang 36 | $ asdf install erlang 24.2 37 | $ asdf global erlang 24.2 38 | 39 | $ asdf plugin add elixir 40 | $ asdf install elixir 1.13.1 41 | $ asdf global elixir 1.13.1 42 | ``` 43 | 44 | ## Phoenix 45 | 46 | > For those already familiar with Elixir and Phoenix, you may wish to skip ahead straight to integrating TypeScript and React with Phoenix 1.6 47 | 48 | If you haven't already done so, let's install Phoenix following the [Phoenix installation instructions](https://hexdocs.pm/phoenix/installation.html#content). 49 | 50 | First we'll want to get the Hex package manager: 51 | 52 | ``` 53 | $ mix local.hex 54 | Are you sure you want to install "https://repo.hex.pm/installs/1.13.1/hex-1.0.1.ez"? [Yn] 55 | ``` 56 | 57 | Then install the Phoenix application generator: 58 | 59 | ``` 60 | $ mix archive.install hex phx_new 61 | Resolving Hex dependencies... 62 | Dependency resolution completed: 63 | New: 64 | phx_new 1.6.5 65 | * Getting phx_new (Hex package) 66 | All dependencies are up to date 67 | Compiling 11 files (.ex) 68 | Generated phx_new app 69 | Generated archive "phx_new-1.6.5.ez" with MIX_ENV=prod 70 | Are you sure you want to install "phx_new-1.6.5.ez"? [Yn] 71 | ``` 72 | 73 | You can check if Phoenix installation went well using `mix phx.new --version` 74 | 75 | ``` 76 | $ mix phx.new --version 77 | Phoenix installer v1.6.5 78 | ``` 79 | 80 | ### Generate the Phoenix app 81 | 82 | ``` 83 | $ mix phx.new hello --umbrella 84 | ``` 85 | 86 | This will generate an Elixir + Phoenix [umbrella app](https://elixir-lang.org/getting-started/mix-otp/dependencies-and-umbrella-projects.html) named `hello_umbrella` in the current directory with the following directory structure: 87 | 88 | ``` 89 | . 90 | ├── apps 91 | │ ├── hello 92 | │ └── hello_web 93 | └── config 94 | ``` 95 | 96 | 97 | The two Elixir apps are `/apps/hello` and `apps/hello_web`. 98 | 99 | Each app will its own dependency configuration, though the entire umbrella project will have a shared dependency library (in `/deps`) for all apps. 100 | 101 | All child apps also share the same root configuration in the `/config` folder. 102 | 103 | We start with an umbrella project because it helps organise code as the application grows in size and complexity. I've also found that it's easier to refactor an umbrella project down to a single app project that it is to go the other way around. 104 | 105 | 106 | ### PostgreSQL, MySQL, or --no-ecto 107 | 108 | Phoenix by default uses Postgres for its database. 109 | 110 | If you want to use MySQL rather than Postgres, then you'll need to generate your Phoenix app using 111 | 112 | ``` 113 | mix phx.new hello_react --umbrella --database mysql 114 | ``` 115 | 116 | If you won't be needing a database or only wish to follow along without one, then create your Phoenix app using 117 | 118 | ``` 119 | mix phx.new hello_react --umbrella --no-ecto 120 | ``` 121 | 122 | The rest of this guide, however, assumes the default which is Postgres. 123 | 124 | 125 | ### Git 126 | 127 | At this point, we should start using Git to track our changes. If you don't need to use Git, feel free to skip to the next section. 128 | 129 | ``` 130 | $ cd hello_umbrella 131 | ~/hello_umbrella $ 132 | ``` 133 | 134 | ``` 135 | $ git init 136 | Initialized empty Git repository in /Users/aisrael/hello_react_umbrella/.git/ 137 | $ git add -A 138 | $ git commit -m "mix phx.new hello --umbrella" 139 | ``` 140 | 141 | ### Docker Compose 142 | 143 | Since we'll be needing a PostgreSQL server to run our Phoenix app, for local development and testing purposes we've found that using Docker, specifically, Docker Compose makes dealing with service dependencies a breeze. 144 | 145 | Create the following `docker-compose.yml` in the project root: 146 | 147 | ``` 148 | version: "3" 149 | services: 150 | postgres: 151 | image: postgres:14.1 152 | ports: 153 | - 5432:5432 154 | environment: 155 | POSTGRES_USER: postgres 156 | POSTGRES_PASSWORD: postgres 157 | POSTGRES_DB: hello_dev 158 | ``` 159 | 160 | Note that we configure PostgreSQL (using the `POSTGRES_*` environment variables) to work with the generated Phoenix app defaults. 161 | 162 | Then, to run Postgres in the background you only need to go: 163 | 164 | ``` 165 | docker-compose up -d 166 | [+] Running 2/2 167 | ⠿ Network elixir-phoenix-typescript-react_default Created 168 | ⠿ Container elixir-phoenix-typescript-react_postgres_1 Started 169 | ``` 170 | 171 | For other Docker Compose commands please just visit [https://docs.docker.com/compose/reference/](https://docs.docker.com/compose/reference/) 172 | 173 | If you can't or don't want to use Docker & Docker Compose, you'll have to install PostgreSQL by hand on your local workstation. Make sure to configure it with the same defaults generated by `mix phx.new`, or, modify the respective `config/*.exs` files with the appropriate credentials. 174 | 175 | 176 | ### Welcome to Phoenix! 177 | 178 | At this point we should be able to run our Phoenix application. From the project root (you may wish to run this in a new terminal window or tab), just go: 179 | 180 | ``` 181 | ~/hello_umbrella$ mix phx.server 182 | ``` 183 | 184 | (If you get a prompt asking if you want to install `rebar3`, just go ahead and say yes.) 185 | 186 | Now if we visit [http://localhost:4000](http://localhost:4000) we should be able to see the familiar "Welcome to Phoenix!" page. 187 | 188 | ## Typescript in Phoenix 1.6 189 | 190 | Since Phoenix 1.6 replaced `webpack` with [`esbuild`](https://github.com/evanw/esbuild), it now _supports Typescript out of the box!_ — no further tooling or configuration needed! 191 | 192 | ### Welcome to Phoenix with Typescript! 193 | 194 | To demonstrate Typescript in action, let's create a new Typescript module `apps/hello_web/assets/js/greeter.ts`: 195 | 196 | ``` 197 | function greet(name: string): string { 198 | return "Welcome to " + name + " with TypeScript!"; 199 | } 200 | 201 | export default greet; 202 | ``` 203 | 204 | Then, in `assets/js/app.js` add the following lines toward the end: 205 | 206 | ``` 207 | import greet from "./greeter"; 208 | 209 | document.querySelector("section.phx-hero h1").innerHTML = greet("Phoenix"); 210 | ``` 211 | 212 | Refresh the page at [localhost:4000](http://localhost:4000) and you should now see it say "Welcome to Phoenix with Typescript!". 213 | 214 | That's it! No need for `npm` or fiddling with `tsconfig.json` and `webpack.config.js`! 215 | 216 | --- 217 | 218 | ## React 219 | 220 | Now we can add React into the mix. For this, we'll now need `npm` to fetch and install the necessary packages. 221 | 222 | First, make sure we're in the `apps/hello_web/assets` directory: 223 | 224 | ``` 225 | ~/hello_umbrella$ cd apps/hello_web/assets 226 | ``` 227 | 228 | From there, we'll issue: 229 | 230 | ``` 231 | npm install --save react react-dom 232 | npm install --save-dev @types/react @types/react-dom 233 | ``` 234 | 235 | ### Our First Component 236 | 237 | Let's rename `greeter.ts` to `greeter.tsx` (similar to how you would rename a regular `.js` file to `.jsx`). 238 | 239 | Then, replace the contents of `greeter.tsx` with a `Greeter` React component: 240 | 241 | ``` 242 | import React from "react"; 243 | 244 | interface GreeterProps { 245 | name: string; 246 | } 247 | const Greeter: React.FC = (props: GreeterProps) => { 248 | const name = props.name; 249 | return ( 250 |
251 |

Welcome to {name} with TypeScript and React!

252 |

Peace-of-mind from prototype to production

253 |
254 | ); 255 | }; 256 | 257 | export default Greeter; 258 | ``` 259 | 260 | ### Welcome to Phoenix with TypeScript and React 261 | 262 | Next, edit the file `apps/hello_web/lib/hello_web/templates/page/index.html.heex` and replace the entire section that goes: 263 | 264 | ``` 265 |
266 |

<%= gettext "Welcome to %{name}!", name: "Phoenix" %>

267 |

Peace of mind from prototype to production

268 |
269 | ``` 270 | 271 | With just 272 | 273 | ``` 274 |
275 | ``` 276 | 277 | Now, we'll need to rename `apps/hello_web/assets/js/app.js` to `app.jsx`, and replace the last two lines we added earlier with: 278 | 279 | ``` 280 | import React from "react"; 281 | import ReactDOM from "react-dom"; 282 | 283 | import Greeter from "./greeter"; 284 | 285 | const greeting = document.getElementById("greeting"); 286 | ReactDOM.render(, greeting); 287 | ``` 288 | 289 | (We need to rename it from `.js` to `.jsx` to avoid a syntax error in the last line.) 290 | 291 | Finally, we'll need to edit `config/config.exs` to tell esbuild to look for `app.jsx` instead of `app.js`. Look for the section starting with `# Configure esbuild` and replace the line that goes 292 | 293 | ``` 294 | ~w(js/app.js --bundle --target=es2017 --outdir=../priv/static/assets --external:/fonts/* --external:/images/*), 295 | ``` 296 | 297 | with 298 | 299 | ``` 300 | ~w(js/app.jsx --bundle --target=es2017 --outdir=../priv/static/assets --external:/fonts/* --external:/images/*) 301 | ``` 302 | 303 | At this point, we might have to restart our Phoenix server (press `Ctrl+C` then `(a)bort)` and restart it again with `mix phx.server`. 304 | 305 | When we reload [http://localhost:4000](http://localhost:4000), we should then be greeted with "Welcome to Phoenix with TypeScript and React!". 306 | -------------------------------------------------------------------------------- /apps/hello/.formatter.exs: -------------------------------------------------------------------------------- 1 | [ 2 | import_deps: [:ecto], 3 | inputs: ["*.{ex,exs}", "priv/*/seeds.exs", "{config,lib,test}/**/*.{ex,exs}"], 4 | subdirectories: ["priv/*/migrations"] 5 | ] 6 | -------------------------------------------------------------------------------- /apps/hello/.gitignore: -------------------------------------------------------------------------------- 1 | # The directory Mix will write compiled artifacts to. 2 | /_build/ 3 | 4 | # If you run "mix test --cover", coverage assets end up here. 5 | /cover/ 6 | 7 | # The directory Mix downloads your dependencies sources to. 8 | /deps/ 9 | 10 | # Where 3rd-party dependencies like ExDoc output generated docs. 11 | /doc/ 12 | 13 | # Ignore .fetch files in case you like to edit your project deps locally. 14 | /.fetch 15 | 16 | # If the VM crashes, it generates a dump, let's ignore it too. 17 | erl_crash.dump 18 | 19 | # Also ignore archive artifacts (built via "mix archive.build"). 20 | *.ez 21 | 22 | # Ignore package tarball (built via "mix hex.build"). 23 | hello-*.tar 24 | -------------------------------------------------------------------------------- /apps/hello/README.md: -------------------------------------------------------------------------------- 1 | # Hello 2 | 3 | **TODO: Add description** 4 | -------------------------------------------------------------------------------- /apps/hello/lib/hello.ex: -------------------------------------------------------------------------------- 1 | defmodule Hello do 2 | @moduledoc """ 3 | Hello keeps the contexts that define your domain 4 | and business logic. 5 | 6 | Contexts are also responsible for managing your data, regardless 7 | if it comes from the database, an external API or others. 8 | """ 9 | end 10 | -------------------------------------------------------------------------------- /apps/hello/lib/hello/application.ex: -------------------------------------------------------------------------------- 1 | defmodule Hello.Application do 2 | # See https://hexdocs.pm/elixir/Application.html 3 | # for more information on OTP Applications 4 | @moduledoc false 5 | 6 | use Application 7 | 8 | @impl true 9 | def start(_type, _args) do 10 | children = [ 11 | # Start the Ecto repository 12 | Hello.Repo, 13 | # Start the PubSub system 14 | {Phoenix.PubSub, name: Hello.PubSub} 15 | # Start a worker by calling: Hello.Worker.start_link(arg) 16 | # {Hello.Worker, arg} 17 | ] 18 | 19 | Supervisor.start_link(children, strategy: :one_for_one, name: Hello.Supervisor) 20 | end 21 | end 22 | -------------------------------------------------------------------------------- /apps/hello/lib/hello/mailer.ex: -------------------------------------------------------------------------------- 1 | defmodule Hello.Mailer do 2 | use Swoosh.Mailer, otp_app: :hello 3 | end 4 | -------------------------------------------------------------------------------- /apps/hello/lib/hello/repo.ex: -------------------------------------------------------------------------------- 1 | defmodule Hello.Repo do 2 | use Ecto.Repo, 3 | otp_app: :hello, 4 | adapter: Ecto.Adapters.Postgres 5 | end 6 | -------------------------------------------------------------------------------- /apps/hello/mix.exs: -------------------------------------------------------------------------------- 1 | defmodule Hello.MixProject do 2 | use Mix.Project 3 | 4 | def project do 5 | [ 6 | app: :hello, 7 | version: "0.1.0", 8 | build_path: "../../_build", 9 | config_path: "../../config/config.exs", 10 | deps_path: "../../deps", 11 | lockfile: "../../mix.lock", 12 | elixir: "~> 1.12", 13 | elixirc_paths: elixirc_paths(Mix.env()), 14 | start_permanent: Mix.env() == :prod, 15 | aliases: aliases(), 16 | deps: deps() 17 | ] 18 | end 19 | 20 | # Configuration for the OTP application. 21 | # 22 | # Type `mix help compile.app` for more information. 23 | def application do 24 | [ 25 | mod: {Hello.Application, []}, 26 | extra_applications: [:logger, :runtime_tools] 27 | ] 28 | end 29 | 30 | # Specifies which paths to compile per environment. 31 | defp elixirc_paths(:test), do: ["lib", "test/support"] 32 | defp elixirc_paths(_), do: ["lib"] 33 | 34 | # Specifies your project dependencies. 35 | # 36 | # Type `mix help deps` for examples and options. 37 | defp deps do 38 | [ 39 | {:phoenix_pubsub, "~> 2.0"}, 40 | {:ecto_sql, "~> 3.6"}, 41 | {:postgrex, ">= 0.0.0"}, 42 | {:jason, "~> 1.2"}, 43 | {:swoosh, "~> 1.3"} 44 | ] 45 | end 46 | 47 | # Aliases are shortcuts or tasks specific to the current project. 48 | # 49 | # See the documentation for `Mix` for more info on aliases. 50 | defp aliases do 51 | [ 52 | setup: ["deps.get", "ecto.setup"], 53 | "ecto.setup": ["ecto.create", "ecto.migrate", "run priv/repo/seeds.exs"], 54 | "ecto.reset": ["ecto.drop", "ecto.setup"], 55 | test: ["ecto.create --quiet", "ecto.migrate --quiet", "test"] 56 | ] 57 | end 58 | end 59 | -------------------------------------------------------------------------------- /apps/hello/priv/repo/migrations/.formatter.exs: -------------------------------------------------------------------------------- 1 | [ 2 | import_deps: [:ecto_sql], 3 | inputs: ["*.exs"] 4 | ] 5 | -------------------------------------------------------------------------------- /apps/hello/priv/repo/seeds.exs: -------------------------------------------------------------------------------- 1 | # Script for populating the database. You can run it as: 2 | # 3 | # mix run priv/repo/seeds.exs 4 | # 5 | # Inside the script, you can read and write to any of your 6 | # repositories directly: 7 | # 8 | # Hello.Repo.insert!(%Hello.SomeSchema{}) 9 | # 10 | # We recommend using the bang functions (`insert!`, `update!` 11 | # and so on) as they will fail if something goes wrong. 12 | -------------------------------------------------------------------------------- /apps/hello/test/support/data_case.ex: -------------------------------------------------------------------------------- 1 | defmodule Hello.DataCase do 2 | @moduledoc """ 3 | This module defines the setup for tests requiring 4 | access to the application's data layer. 5 | 6 | You may define functions here to be used as helpers in 7 | your tests. 8 | 9 | Finally, if the test case interacts with the database, 10 | we enable the SQL sandbox, so changes done to the database 11 | are reverted at the end of every test. If you are using 12 | PostgreSQL, you can even run database tests asynchronously 13 | by setting `use Hello.DataCase, async: true`, although 14 | this option is not recommended for other databases. 15 | """ 16 | 17 | use ExUnit.CaseTemplate 18 | 19 | using do 20 | quote do 21 | alias Hello.Repo 22 | 23 | import Ecto 24 | import Ecto.Changeset 25 | import Ecto.Query 26 | import Hello.DataCase 27 | end 28 | end 29 | 30 | setup tags do 31 | pid = Ecto.Adapters.SQL.Sandbox.start_owner!(Hello.Repo, shared: not tags[:async]) 32 | on_exit(fn -> Ecto.Adapters.SQL.Sandbox.stop_owner(pid) end) 33 | :ok 34 | end 35 | 36 | @doc """ 37 | A helper that transforms changeset errors into a map of messages. 38 | 39 | assert {:error, changeset} = Accounts.create_user(%{password: "short"}) 40 | assert "password is too short" in errors_on(changeset).password 41 | assert %{password: ["password is too short"]} = errors_on(changeset) 42 | 43 | """ 44 | def errors_on(changeset) do 45 | Ecto.Changeset.traverse_errors(changeset, fn {message, opts} -> 46 | Regex.replace(~r"%{(\w+)}", message, fn _, key -> 47 | opts |> Keyword.get(String.to_existing_atom(key), key) |> to_string() 48 | end) 49 | end) 50 | end 51 | end 52 | -------------------------------------------------------------------------------- /apps/hello/test/test_helper.exs: -------------------------------------------------------------------------------- 1 | ExUnit.start() 2 | Ecto.Adapters.SQL.Sandbox.mode(Hello.Repo, :manual) 3 | -------------------------------------------------------------------------------- /apps/hello_web/.formatter.exs: -------------------------------------------------------------------------------- 1 | [ 2 | import_deps: [:phoenix], 3 | inputs: ["*.{ex,exs}", "{config,lib,test}/**/*.{ex,exs}"] 4 | ] 5 | -------------------------------------------------------------------------------- /apps/hello_web/.gitignore: -------------------------------------------------------------------------------- 1 | # The directory Mix will write compiled artifacts to. 2 | /_build/ 3 | 4 | # If you run "mix test --cover", coverage assets end up here. 5 | /cover/ 6 | 7 | # The directory Mix downloads your dependencies sources to. 8 | /deps/ 9 | 10 | # Where 3rd-party dependencies like ExDoc output generated docs. 11 | /doc/ 12 | 13 | # Ignore .fetch files in case you like to edit your project deps locally. 14 | /.fetch 15 | 16 | # If the VM crashes, it generates a dump, let's ignore it too. 17 | erl_crash.dump 18 | 19 | # Also ignore archive artifacts (built via "mix archive.build"). 20 | *.ez 21 | 22 | # Ignore package tarball (built via "mix hex.build"). 23 | hello_web-*.tar 24 | 25 | # Ignore assets that are produced by build tools. 26 | /priv/static/assets/ 27 | 28 | # Ignore digested assets cache. 29 | /priv/static/cache_manifest.json 30 | 31 | # In case you use Node.js/npm, you want to ignore these. 32 | npm-debug.log 33 | /assets/node_modules/ 34 | 35 | -------------------------------------------------------------------------------- /apps/hello_web/README.md: -------------------------------------------------------------------------------- 1 | # HelloWeb 2 | 3 | To start your Phoenix server: 4 | 5 | * Install dependencies with `mix deps.get` 6 | * Create and migrate your database with `mix ecto.setup` 7 | * Start Phoenix endpoint with `mix phx.server` 8 | 9 | Now you can visit [`localhost:4000`](http://localhost:4000) from your browser. 10 | 11 | Ready to run in production? Please [check our deployment guides](https://hexdocs.pm/phoenix/deployment.html). 12 | 13 | ## Learn more 14 | 15 | * Official website: https://www.phoenixframework.org/ 16 | * Guides: https://hexdocs.pm/phoenix/overview.html 17 | * Docs: https://hexdocs.pm/phoenix 18 | * Forum: https://elixirforum.com/c/phoenix-forum 19 | * Source: https://github.com/phoenixframework/phoenix 20 | -------------------------------------------------------------------------------- /apps/hello_web/assets/css/app.css: -------------------------------------------------------------------------------- 1 | /* This file is for your main application CSS */ 2 | @import "./phoenix.css"; 3 | 4 | /* Alerts and form errors used by phx.new */ 5 | .alert { 6 | padding: 15px; 7 | margin-bottom: 20px; 8 | border: 1px solid transparent; 9 | border-radius: 4px; 10 | } 11 | .alert-info { 12 | color: #31708f; 13 | background-color: #d9edf7; 14 | border-color: #bce8f1; 15 | } 16 | .alert-warning { 17 | color: #8a6d3b; 18 | background-color: #fcf8e3; 19 | border-color: #faebcc; 20 | } 21 | .alert-danger { 22 | color: #a94442; 23 | background-color: #f2dede; 24 | border-color: #ebccd1; 25 | } 26 | .alert p { 27 | margin-bottom: 0; 28 | } 29 | .alert:empty { 30 | display: none; 31 | } 32 | .invalid-feedback { 33 | color: #a94442; 34 | display: block; 35 | margin: -1rem 0 2rem; 36 | } 37 | 38 | /* LiveView specific classes for your customization */ 39 | .phx-no-feedback.invalid-feedback, 40 | .phx-no-feedback .invalid-feedback { 41 | display: none; 42 | } 43 | 44 | .phx-click-loading { 45 | opacity: 0.5; 46 | transition: opacity 1s ease-out; 47 | } 48 | 49 | .phx-loading{ 50 | cursor: wait; 51 | } 52 | 53 | .phx-modal { 54 | opacity: 1!important; 55 | position: fixed; 56 | z-index: 1; 57 | left: 0; 58 | top: 0; 59 | width: 100%; 60 | height: 100%; 61 | overflow: auto; 62 | background-color: rgba(0,0,0,0.4); 63 | } 64 | 65 | .phx-modal-content { 66 | background-color: #fefefe; 67 | margin: 15vh auto; 68 | padding: 20px; 69 | border: 1px solid #888; 70 | width: 80%; 71 | } 72 | 73 | .phx-modal-close { 74 | color: #aaa; 75 | float: right; 76 | font-size: 28px; 77 | font-weight: bold; 78 | } 79 | 80 | .phx-modal-close:hover, 81 | .phx-modal-close:focus { 82 | color: black; 83 | text-decoration: none; 84 | cursor: pointer; 85 | } 86 | 87 | .fade-in-scale { 88 | animation: 0.2s ease-in 0s normal forwards 1 fade-in-scale-keys; 89 | } 90 | 91 | .fade-out-scale { 92 | animation: 0.2s ease-out 0s normal forwards 1 fade-out-scale-keys; 93 | } 94 | 95 | .fade-in { 96 | animation: 0.2s ease-out 0s normal forwards 1 fade-in-keys; 97 | } 98 | .fade-out { 99 | animation: 0.2s ease-out 0s normal forwards 1 fade-out-keys; 100 | } 101 | 102 | @keyframes fade-in-scale-keys{ 103 | 0% { scale: 0.95; opacity: 0; } 104 | 100% { scale: 1.0; opacity: 1; } 105 | } 106 | 107 | @keyframes fade-out-scale-keys{ 108 | 0% { scale: 1.0; opacity: 1; } 109 | 100% { scale: 0.95; opacity: 0; } 110 | } 111 | 112 | @keyframes fade-in-keys{ 113 | 0% { opacity: 0; } 114 | 100% { opacity: 1; } 115 | } 116 | 117 | @keyframes fade-out-keys{ 118 | 0% { opacity: 1; } 119 | 100% { opacity: 0; } 120 | } 121 | -------------------------------------------------------------------------------- /apps/hello_web/assets/css/phoenix.css: -------------------------------------------------------------------------------- 1 | /* Includes some default style for the starter application. 2 | * This can be safely deleted to start fresh. 3 | */ 4 | 5 | /* Milligram v1.4.1 https://milligram.github.io 6 | * Copyright (c) 2020 CJ Patoilo Licensed under the MIT license 7 | */ 8 | 9 | *,*:after,*:before{box-sizing:inherit}html{box-sizing:border-box;font-size:62.5%}body{color:#000000;font-family:'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;font-size:1.6em;font-weight:300;letter-spacing:.01em;line-height:1.6}blockquote{border-left:0.3rem solid #d1d1d1;margin-left:0;margin-right:0;padding:1rem 1.5rem}blockquote *:last-child{margin-bottom:0}.button,button,input[type='button'],input[type='reset'],input[type='submit']{background-color:#0069d9;border:0.1rem solid #0069d9;border-radius:.4rem;color:#fff;cursor:pointer;display:inline-block;font-size:1.1rem;font-weight:700;height:3.8rem;letter-spacing:.1rem;line-height:3.8rem;padding:0 3.0rem;text-align:center;text-decoration:none;text-transform:uppercase;white-space:nowrap}.button:focus,.button:hover,button:focus,button:hover,input[type='button']:focus,input[type='button']:hover,input[type='reset']:focus,input[type='reset']:hover,input[type='submit']:focus,input[type='submit']:hover{background-color:#606c76;border-color:#606c76;color:#fff;outline:0}.button[disabled],button[disabled],input[type='button'][disabled],input[type='reset'][disabled],input[type='submit'][disabled]{cursor:default;opacity:.5}.button[disabled]:focus,.button[disabled]:hover,button[disabled]:focus,button[disabled]:hover,input[type='button'][disabled]:focus,input[type='button'][disabled]:hover,input[type='reset'][disabled]:focus,input[type='reset'][disabled]:hover,input[type='submit'][disabled]:focus,input[type='submit'][disabled]:hover{background-color:#0069d9;border-color:#0069d9}.button.button-outline,button.button-outline,input[type='button'].button-outline,input[type='reset'].button-outline,input[type='submit'].button-outline{background-color:transparent;color:#0069d9}.button.button-outline:focus,.button.button-outline:hover,button.button-outline:focus,button.button-outline:hover,input[type='button'].button-outline:focus,input[type='button'].button-outline:hover,input[type='reset'].button-outline:focus,input[type='reset'].button-outline:hover,input[type='submit'].button-outline:focus,input[type='submit'].button-outline:hover{background-color:transparent;border-color:#606c76;color:#606c76}.button.button-outline[disabled]:focus,.button.button-outline[disabled]:hover,button.button-outline[disabled]:focus,button.button-outline[disabled]:hover,input[type='button'].button-outline[disabled]:focus,input[type='button'].button-outline[disabled]:hover,input[type='reset'].button-outline[disabled]:focus,input[type='reset'].button-outline[disabled]:hover,input[type='submit'].button-outline[disabled]:focus,input[type='submit'].button-outline[disabled]:hover{border-color:inherit;color:#0069d9}.button.button-clear,button.button-clear,input[type='button'].button-clear,input[type='reset'].button-clear,input[type='submit'].button-clear{background-color:transparent;border-color:transparent;color:#0069d9}.button.button-clear:focus,.button.button-clear:hover,button.button-clear:focus,button.button-clear:hover,input[type='button'].button-clear:focus,input[type='button'].button-clear:hover,input[type='reset'].button-clear:focus,input[type='reset'].button-clear:hover,input[type='submit'].button-clear:focus,input[type='submit'].button-clear:hover{background-color:transparent;border-color:transparent;color:#606c76}.button.button-clear[disabled]:focus,.button.button-clear[disabled]:hover,button.button-clear[disabled]:focus,button.button-clear[disabled]:hover,input[type='button'].button-clear[disabled]:focus,input[type='button'].button-clear[disabled]:hover,input[type='reset'].button-clear[disabled]:focus,input[type='reset'].button-clear[disabled]:hover,input[type='submit'].button-clear[disabled]:focus,input[type='submit'].button-clear[disabled]:hover{color:#0069d9}code{background:#f4f5f6;border-radius:.4rem;font-size:86%;margin:0 .2rem;padding:.2rem .5rem;white-space:nowrap}pre{background:#f4f5f6;border-left:0.3rem solid #0069d9;overflow-y:hidden}pre>code{border-radius:0;display:block;padding:1rem 1.5rem;white-space:pre}hr{border:0;border-top:0.1rem solid #f4f5f6;margin:3.0rem 0}input[type='color'],input[type='date'],input[type='datetime'],input[type='datetime-local'],input[type='email'],input[type='month'],input[type='number'],input[type='password'],input[type='search'],input[type='tel'],input[type='text'],input[type='url'],input[type='week'],input:not([type]),textarea,select{-webkit-appearance:none;background-color:transparent;border:0.1rem solid #d1d1d1;border-radius:.4rem;box-shadow:none;box-sizing:inherit;height:3.8rem;padding:.6rem 1.0rem .7rem;width:100%}input[type='color']:focus,input[type='date']:focus,input[type='datetime']:focus,input[type='datetime-local']:focus,input[type='email']:focus,input[type='month']:focus,input[type='number']:focus,input[type='password']:focus,input[type='search']:focus,input[type='tel']:focus,input[type='text']:focus,input[type='url']:focus,input[type='week']:focus,input:not([type]):focus,textarea:focus,select:focus{border-color:#0069d9;outline:0}select{background:url('data:image/svg+xml;utf8,') center right no-repeat;padding-right:3.0rem}select:focus{background-image:url('data:image/svg+xml;utf8,')}select[multiple]{background:none;height:auto}textarea{min-height:6.5rem}label,legend{display:block;font-size:1.6rem;font-weight:700;margin-bottom:.5rem}fieldset{border-width:0;padding:0}input[type='checkbox'],input[type='radio']{display:inline}.label-inline{display:inline-block;font-weight:normal;margin-left:.5rem}.container{margin:0 auto;max-width:112.0rem;padding:0 2.0rem;position:relative;width:100%}.row{display:flex;flex-direction:column;padding:0;width:100%}.row.row-no-padding{padding:0}.row.row-no-padding>.column{padding:0}.row.row-wrap{flex-wrap:wrap}.row.row-top{align-items:flex-start}.row.row-bottom{align-items:flex-end}.row.row-center{align-items:center}.row.row-stretch{align-items:stretch}.row.row-baseline{align-items:baseline}.row .column{display:block;flex:1 1 auto;margin-left:0;max-width:100%;width:100%}.row .column.column-offset-10{margin-left:10%}.row .column.column-offset-20{margin-left:20%}.row .column.column-offset-25{margin-left:25%}.row .column.column-offset-33,.row .column.column-offset-34{margin-left:33.3333%}.row .column.column-offset-40{margin-left:40%}.row .column.column-offset-50{margin-left:50%}.row .column.column-offset-60{margin-left:60%}.row .column.column-offset-66,.row .column.column-offset-67{margin-left:66.6666%}.row .column.column-offset-75{margin-left:75%}.row .column.column-offset-80{margin-left:80%}.row .column.column-offset-90{margin-left:90%}.row .column.column-10{flex:0 0 10%;max-width:10%}.row .column.column-20{flex:0 0 20%;max-width:20%}.row .column.column-25{flex:0 0 25%;max-width:25%}.row .column.column-33,.row .column.column-34{flex:0 0 33.3333%;max-width:33.3333%}.row .column.column-40{flex:0 0 40%;max-width:40%}.row .column.column-50{flex:0 0 50%;max-width:50%}.row .column.column-60{flex:0 0 60%;max-width:60%}.row .column.column-66,.row .column.column-67{flex:0 0 66.6666%;max-width:66.6666%}.row .column.column-75{flex:0 0 75%;max-width:75%}.row .column.column-80{flex:0 0 80%;max-width:80%}.row .column.column-90{flex:0 0 90%;max-width:90%}.row .column .column-top{align-self:flex-start}.row .column .column-bottom{align-self:flex-end}.row .column .column-center{align-self:center}@media (min-width: 40rem){.row{flex-direction:row;margin-left:-1.0rem;width:calc(100% + 2.0rem)}.row .column{margin-bottom:inherit;padding:0 1.0rem}}a{color:#0069d9;text-decoration:none}a:focus,a:hover{color:#606c76}dl,ol,ul{list-style:none;margin-top:0;padding-left:0}dl dl,dl ol,dl ul,ol dl,ol ol,ol ul,ul dl,ul ol,ul ul{font-size:90%;margin:1.5rem 0 1.5rem 3.0rem}ol{list-style:decimal inside}ul{list-style:circle inside}.button,button,dd,dt,li{margin-bottom:1.0rem}fieldset,input,select,textarea{margin-bottom:1.5rem}blockquote,dl,figure,form,ol,p,pre,table,ul{margin-bottom:2.5rem}table{border-spacing:0;display:block;overflow-x:auto;text-align:left;width:100%}td,th{border-bottom:0.1rem solid #e1e1e1;padding:1.2rem 1.5rem}td:first-child,th:first-child{padding-left:0}td:last-child,th:last-child{padding-right:0}@media (min-width: 40rem){table{display:table;overflow-x:initial}}b,strong{font-weight:bold}p{margin-top:0}h1,h2,h3,h4,h5,h6{font-weight:300;letter-spacing:-.1rem;margin-bottom:2.0rem;margin-top:0}h1{font-size:4.6rem;line-height:1.2}h2{font-size:3.6rem;line-height:1.25}h3{font-size:2.8rem;line-height:1.3}h4{font-size:2.2rem;letter-spacing:-.08rem;line-height:1.35}h5{font-size:1.8rem;letter-spacing:-.05rem;line-height:1.5}h6{font-size:1.6rem;letter-spacing:0;line-height:1.4}img{max-width:100%}.clearfix:after{clear:both;content:' ';display:table}.float-left{float:left}.float-right{float:right} 10 | 11 | /* General style */ 12 | h1{font-size: 3.6rem; line-height: 1.25} 13 | h2{font-size: 2.8rem; line-height: 1.3} 14 | h3{font-size: 2.2rem; letter-spacing: -.08rem; line-height: 1.35} 15 | h4{font-size: 1.8rem; letter-spacing: -.05rem; line-height: 1.5} 16 | h5{font-size: 1.6rem; letter-spacing: 0; line-height: 1.4} 17 | h6{font-size: 1.4rem; letter-spacing: 0; line-height: 1.2} 18 | pre{padding: 1em;} 19 | 20 | .container{ 21 | margin: 0 auto; 22 | max-width: 80.0rem; 23 | padding: 0 2.0rem; 24 | position: relative; 25 | width: 100% 26 | } 27 | select { 28 | width: auto; 29 | } 30 | 31 | /* Phoenix promo and logo */ 32 | .phx-hero { 33 | text-align: center; 34 | border-bottom: 1px solid #e3e3e3; 35 | background: #eee; 36 | border-radius: 6px; 37 | padding: 3em 3em 1em; 38 | margin-bottom: 3rem; 39 | font-weight: 200; 40 | font-size: 120%; 41 | } 42 | .phx-hero input { 43 | background: #ffffff; 44 | } 45 | .phx-logo { 46 | min-width: 300px; 47 | margin: 1rem; 48 | display: block; 49 | } 50 | .phx-logo img { 51 | width: auto; 52 | display: block; 53 | } 54 | 55 | /* Headers */ 56 | header { 57 | width: 100%; 58 | background: #fdfdfd; 59 | border-bottom: 1px solid #eaeaea; 60 | margin-bottom: 2rem; 61 | } 62 | header section { 63 | align-items: center; 64 | display: flex; 65 | flex-direction: column; 66 | justify-content: space-between; 67 | } 68 | header section :first-child { 69 | order: 2; 70 | } 71 | header section :last-child { 72 | order: 1; 73 | } 74 | header nav ul, 75 | header nav li { 76 | margin: 0; 77 | padding: 0; 78 | display: block; 79 | text-align: right; 80 | white-space: nowrap; 81 | } 82 | header nav ul { 83 | margin: 1rem; 84 | margin-top: 0; 85 | } 86 | header nav a { 87 | display: block; 88 | } 89 | 90 | @media (min-width: 40.0rem) { /* Small devices (landscape phones, 576px and up) */ 91 | header section { 92 | flex-direction: row; 93 | } 94 | header nav ul { 95 | margin: 1rem; 96 | } 97 | .phx-logo { 98 | flex-basis: 527px; 99 | margin: 2rem 1rem; 100 | } 101 | } 102 | -------------------------------------------------------------------------------- /apps/hello_web/assets/js/app.jsx: -------------------------------------------------------------------------------- 1 | // We import the CSS which is extracted to its own file by esbuild. 2 | // Remove this line if you add a your own CSS build pipeline (e.g postcss). 3 | import "../css/app.css" 4 | 5 | // If you want to use Phoenix channels, run `mix help phx.gen.channel` 6 | // to get started and then uncomment the line below. 7 | // import "./user_socket.js" 8 | 9 | // You can include dependencies in two ways. 10 | // 11 | // The simplest option is to put them in assets/vendor and 12 | // import them using relative paths: 13 | // 14 | // import "../vendor/some-package.js" 15 | // 16 | // Alternatively, you can `npm install some-package --prefix assets` and import 17 | // them using a path starting with the package name: 18 | // 19 | // import "some-package" 20 | // 21 | 22 | // Include phoenix_html to handle method=PUT/DELETE in forms and buttons. 23 | import "phoenix_html" 24 | // Establish Phoenix Socket and LiveView configuration. 25 | import {Socket} from "phoenix" 26 | import {LiveSocket} from "phoenix_live_view" 27 | import topbar from "../vendor/topbar" 28 | 29 | let csrfToken = document.querySelector("meta[name='csrf-token']").getAttribute("content") 30 | let liveSocket = new LiveSocket("/live", Socket, {params: {_csrf_token: csrfToken}}) 31 | 32 | // Show progress bar on live navigation and form submits 33 | topbar.config({barColors: {0: "#29d"}, shadowColor: "rgba(0, 0, 0, .3)"}) 34 | window.addEventListener("phx:page-loading-start", info => topbar.show()) 35 | window.addEventListener("phx:page-loading-stop", info => topbar.hide()) 36 | 37 | // connect if there are any LiveViews on the page 38 | liveSocket.connect() 39 | 40 | // expose liveSocket on window for web console debug logs and latency simulation: 41 | // >> liveSocket.enableDebug() 42 | // >> liveSocket.enableLatencySim(1000) // enabled for duration of browser session 43 | // >> liveSocket.disableLatencySim() 44 | window.liveSocket = liveSocket 45 | 46 | import React from "react"; 47 | import ReactDOM from "react-dom"; 48 | 49 | import Greeter from "./greeter"; 50 | 51 | const greeting = document.getElementById("greeting"); 52 | ReactDOM.render(, greeting); 53 | -------------------------------------------------------------------------------- /apps/hello_web/assets/js/greeter.tsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | interface GreeterProps { 4 | name: string; 5 | } 6 | 7 | const Greeter: React.FC = (props: GreeterProps) => { 8 | const name = props.name; 9 | return ( 10 |
11 |

Welcome to {name} with TypeScript and React!

12 |

Peace-of-mind from prototype to production

13 |
14 | ); 15 | }; 16 | 17 | export default Greeter; 18 | -------------------------------------------------------------------------------- /apps/hello_web/assets/package-lock.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "assets", 3 | "lockfileVersion": 2, 4 | "requires": true, 5 | "packages": { 6 | "": { 7 | "dependencies": { 8 | "react": "^17.0.2", 9 | "react-dom": "^17.0.2" 10 | }, 11 | "devDependencies": { 12 | "@types/react": "^17.0.38", 13 | "@types/react-dom": "^17.0.11" 14 | } 15 | }, 16 | "node_modules/@types/prop-types": { 17 | "version": "15.7.4", 18 | "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.4.tgz", 19 | "integrity": "sha512-rZ5drC/jWjrArrS8BR6SIr4cWpW09RNTYt9AMZo3Jwwif+iacXAqgVjm0B0Bv/S1jhDXKHqRVNCbACkJ89RAnQ==", 20 | "dev": true 21 | }, 22 | "node_modules/@types/react": { 23 | "version": "17.0.38", 24 | "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.38.tgz", 25 | "integrity": "sha512-SI92X1IA+FMnP3qM5m4QReluXzhcmovhZnLNm3pyeQlooi02qI7sLiepEYqT678uNiyc25XfCqxREFpy3W7YhQ==", 26 | "dev": true, 27 | "dependencies": { 28 | "@types/prop-types": "*", 29 | "@types/scheduler": "*", 30 | "csstype": "^3.0.2" 31 | } 32 | }, 33 | "node_modules/@types/react-dom": { 34 | "version": "17.0.11", 35 | "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-17.0.11.tgz", 36 | "integrity": "sha512-f96K3k+24RaLGVu/Y2Ng3e1EbZ8/cVJvypZWd7cy0ofCBaf2lcM46xNhycMZ2xGwbBjRql7hOlZ+e2WlJ5MH3Q==", 37 | "dev": true, 38 | "dependencies": { 39 | "@types/react": "*" 40 | } 41 | }, 42 | "node_modules/@types/scheduler": { 43 | "version": "0.16.2", 44 | "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz", 45 | "integrity": "sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew==", 46 | "dev": true 47 | }, 48 | "node_modules/csstype": { 49 | "version": "3.0.10", 50 | "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.10.tgz", 51 | "integrity": "sha512-2u44ZG2OcNUO9HDp/Jl8C07x6pU/eTR3ncV91SiK3dhG9TWvRVsCoJw14Ckx5DgWkzGA3waZWO3d7pgqpUI/XA==", 52 | "dev": true 53 | }, 54 | "node_modules/js-tokens": { 55 | "version": "4.0.0", 56 | "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz", 57 | "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==" 58 | }, 59 | "node_modules/loose-envify": { 60 | "version": "1.4.0", 61 | "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz", 62 | "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==", 63 | "dependencies": { 64 | "js-tokens": "^3.0.0 || ^4.0.0" 65 | }, 66 | "bin": { 67 | "loose-envify": "cli.js" 68 | } 69 | }, 70 | "node_modules/object-assign": { 71 | "version": "4.1.1", 72 | "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", 73 | "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=", 74 | "engines": { 75 | "node": ">=0.10.0" 76 | } 77 | }, 78 | "node_modules/react": { 79 | "version": "17.0.2", 80 | "resolved": "https://registry.npmjs.org/react/-/react-17.0.2.tgz", 81 | "integrity": "sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA==", 82 | "dependencies": { 83 | "loose-envify": "^1.1.0", 84 | "object-assign": "^4.1.1" 85 | }, 86 | "engines": { 87 | "node": ">=0.10.0" 88 | } 89 | }, 90 | "node_modules/react-dom": { 91 | "version": "17.0.2", 92 | "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-17.0.2.tgz", 93 | "integrity": "sha512-s4h96KtLDUQlsENhMn1ar8t2bEa+q/YAtj8pPPdIjPDGBDIVNsrD9aXNWqspUe6AzKCIG0C1HZZLqLV7qpOBGA==", 94 | "dependencies": { 95 | "loose-envify": "^1.1.0", 96 | "object-assign": "^4.1.1", 97 | "scheduler": "^0.20.2" 98 | }, 99 | "peerDependencies": { 100 | "react": "17.0.2" 101 | } 102 | }, 103 | "node_modules/scheduler": { 104 | "version": "0.20.2", 105 | "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.20.2.tgz", 106 | "integrity": "sha512-2eWfGgAqqWFGqtdMmcL5zCMK1U8KlXv8SQFGglL3CEtd0aDVDWgeF/YoCmvln55m5zSk3J/20hTaSBeSObsQDQ==", 107 | "dependencies": { 108 | "loose-envify": "^1.1.0", 109 | "object-assign": "^4.1.1" 110 | } 111 | } 112 | }, 113 | "dependencies": { 114 | "@types/prop-types": { 115 | "version": "15.7.4", 116 | "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.4.tgz", 117 | "integrity": "sha512-rZ5drC/jWjrArrS8BR6SIr4cWpW09RNTYt9AMZo3Jwwif+iacXAqgVjm0B0Bv/S1jhDXKHqRVNCbACkJ89RAnQ==", 118 | "dev": true 119 | }, 120 | "@types/react": { 121 | "version": "17.0.38", 122 | "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.38.tgz", 123 | "integrity": "sha512-SI92X1IA+FMnP3qM5m4QReluXzhcmovhZnLNm3pyeQlooi02qI7sLiepEYqT678uNiyc25XfCqxREFpy3W7YhQ==", 124 | "dev": true, 125 | "requires": { 126 | "@types/prop-types": "*", 127 | "@types/scheduler": "*", 128 | "csstype": "^3.0.2" 129 | } 130 | }, 131 | "@types/react-dom": { 132 | "version": "17.0.11", 133 | "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-17.0.11.tgz", 134 | "integrity": "sha512-f96K3k+24RaLGVu/Y2Ng3e1EbZ8/cVJvypZWd7cy0ofCBaf2lcM46xNhycMZ2xGwbBjRql7hOlZ+e2WlJ5MH3Q==", 135 | "dev": true, 136 | "requires": { 137 | "@types/react": "*" 138 | } 139 | }, 140 | "@types/scheduler": { 141 | "version": "0.16.2", 142 | "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz", 143 | "integrity": "sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew==", 144 | "dev": true 145 | }, 146 | "csstype": { 147 | "version": "3.0.10", 148 | "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.10.tgz", 149 | "integrity": "sha512-2u44ZG2OcNUO9HDp/Jl8C07x6pU/eTR3ncV91SiK3dhG9TWvRVsCoJw14Ckx5DgWkzGA3waZWO3d7pgqpUI/XA==", 150 | "dev": true 151 | }, 152 | "js-tokens": { 153 | "version": "4.0.0", 154 | "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz", 155 | "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==" 156 | }, 157 | "loose-envify": { 158 | "version": "1.4.0", 159 | "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz", 160 | "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==", 161 | "requires": { 162 | "js-tokens": "^3.0.0 || ^4.0.0" 163 | } 164 | }, 165 | "object-assign": { 166 | "version": "4.1.1", 167 | "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", 168 | "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=" 169 | }, 170 | "react": { 171 | "version": "17.0.2", 172 | "resolved": "https://registry.npmjs.org/react/-/react-17.0.2.tgz", 173 | "integrity": "sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA==", 174 | "requires": { 175 | "loose-envify": "^1.1.0", 176 | "object-assign": "^4.1.1" 177 | } 178 | }, 179 | "react-dom": { 180 | "version": "17.0.2", 181 | "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-17.0.2.tgz", 182 | "integrity": "sha512-s4h96KtLDUQlsENhMn1ar8t2bEa+q/YAtj8pPPdIjPDGBDIVNsrD9aXNWqspUe6AzKCIG0C1HZZLqLV7qpOBGA==", 183 | "requires": { 184 | "loose-envify": "^1.1.0", 185 | "object-assign": "^4.1.1", 186 | "scheduler": "^0.20.2" 187 | } 188 | }, 189 | "scheduler": { 190 | "version": "0.20.2", 191 | "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.20.2.tgz", 192 | "integrity": "sha512-2eWfGgAqqWFGqtdMmcL5zCMK1U8KlXv8SQFGglL3CEtd0aDVDWgeF/YoCmvln55m5zSk3J/20hTaSBeSObsQDQ==", 193 | "requires": { 194 | "loose-envify": "^1.1.0", 195 | "object-assign": "^4.1.1" 196 | } 197 | } 198 | } 199 | } 200 | -------------------------------------------------------------------------------- /apps/hello_web/assets/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "dependencies": { 3 | "react": "^17.0.2", 4 | "react-dom": "^17.0.2" 5 | }, 6 | "devDependencies": { 7 | "@types/react": "^17.0.38", 8 | "@types/react-dom": "^17.0.11" 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /apps/hello_web/assets/vendor/topbar.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @license MIT 3 | * topbar 1.0.0, 2021-01-06 4 | * https://buunguyen.github.io/topbar 5 | * Copyright (c) 2021 Buu Nguyen 6 | */ 7 | (function (window, document) { 8 | "use strict"; 9 | 10 | // https://gist.github.com/paulirish/1579671 11 | (function () { 12 | var lastTime = 0; 13 | var vendors = ["ms", "moz", "webkit", "o"]; 14 | for (var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) { 15 | window.requestAnimationFrame = 16 | window[vendors[x] + "RequestAnimationFrame"]; 17 | window.cancelAnimationFrame = 18 | window[vendors[x] + "CancelAnimationFrame"] || 19 | window[vendors[x] + "CancelRequestAnimationFrame"]; 20 | } 21 | if (!window.requestAnimationFrame) 22 | window.requestAnimationFrame = function (callback, element) { 23 | var currTime = new Date().getTime(); 24 | var timeToCall = Math.max(0, 16 - (currTime - lastTime)); 25 | var id = window.setTimeout(function () { 26 | callback(currTime + timeToCall); 27 | }, timeToCall); 28 | lastTime = currTime + timeToCall; 29 | return id; 30 | }; 31 | if (!window.cancelAnimationFrame) 32 | window.cancelAnimationFrame = function (id) { 33 | clearTimeout(id); 34 | }; 35 | })(); 36 | 37 | var canvas, 38 | progressTimerId, 39 | fadeTimerId, 40 | currentProgress, 41 | showing, 42 | addEvent = function (elem, type, handler) { 43 | if (elem.addEventListener) elem.addEventListener(type, handler, false); 44 | else if (elem.attachEvent) elem.attachEvent("on" + type, handler); 45 | else elem["on" + type] = handler; 46 | }, 47 | options = { 48 | autoRun: true, 49 | barThickness: 3, 50 | barColors: { 51 | 0: "rgba(26, 188, 156, .9)", 52 | ".25": "rgba(52, 152, 219, .9)", 53 | ".50": "rgba(241, 196, 15, .9)", 54 | ".75": "rgba(230, 126, 34, .9)", 55 | "1.0": "rgba(211, 84, 0, .9)", 56 | }, 57 | shadowBlur: 10, 58 | shadowColor: "rgba(0, 0, 0, .6)", 59 | className: null, 60 | }, 61 | repaint = function () { 62 | canvas.width = window.innerWidth; 63 | canvas.height = options.barThickness * 5; // need space for shadow 64 | 65 | var ctx = canvas.getContext("2d"); 66 | ctx.shadowBlur = options.shadowBlur; 67 | ctx.shadowColor = options.shadowColor; 68 | 69 | var lineGradient = ctx.createLinearGradient(0, 0, canvas.width, 0); 70 | for (var stop in options.barColors) 71 | lineGradient.addColorStop(stop, options.barColors[stop]); 72 | ctx.lineWidth = options.barThickness; 73 | ctx.beginPath(); 74 | ctx.moveTo(0, options.barThickness / 2); 75 | ctx.lineTo( 76 | Math.ceil(currentProgress * canvas.width), 77 | options.barThickness / 2 78 | ); 79 | ctx.strokeStyle = lineGradient; 80 | ctx.stroke(); 81 | }, 82 | createCanvas = function () { 83 | canvas = document.createElement("canvas"); 84 | var style = canvas.style; 85 | style.position = "fixed"; 86 | style.top = style.left = style.right = style.margin = style.padding = 0; 87 | style.zIndex = 100001; 88 | style.display = "none"; 89 | if (options.className) canvas.classList.add(options.className); 90 | document.body.appendChild(canvas); 91 | addEvent(window, "resize", repaint); 92 | }, 93 | topbar = { 94 | config: function (opts) { 95 | for (var key in opts) 96 | if (options.hasOwnProperty(key)) options[key] = opts[key]; 97 | }, 98 | show: function () { 99 | if (showing) return; 100 | showing = true; 101 | if (fadeTimerId !== null) window.cancelAnimationFrame(fadeTimerId); 102 | if (!canvas) createCanvas(); 103 | canvas.style.opacity = 1; 104 | canvas.style.display = "block"; 105 | topbar.progress(0); 106 | if (options.autoRun) { 107 | (function loop() { 108 | progressTimerId = window.requestAnimationFrame(loop); 109 | topbar.progress( 110 | "+" + 0.05 * Math.pow(1 - Math.sqrt(currentProgress), 2) 111 | ); 112 | })(); 113 | } 114 | }, 115 | progress: function (to) { 116 | if (typeof to === "undefined") return currentProgress; 117 | if (typeof to === "string") { 118 | to = 119 | (to.indexOf("+") >= 0 || to.indexOf("-") >= 0 120 | ? currentProgress 121 | : 0) + parseFloat(to); 122 | } 123 | currentProgress = to > 1 ? 1 : to; 124 | repaint(); 125 | return currentProgress; 126 | }, 127 | hide: function () { 128 | if (!showing) return; 129 | showing = false; 130 | if (progressTimerId != null) { 131 | window.cancelAnimationFrame(progressTimerId); 132 | progressTimerId = null; 133 | } 134 | (function loop() { 135 | if (topbar.progress("+.1") >= 1) { 136 | canvas.style.opacity -= 0.05; 137 | if (canvas.style.opacity <= 0.05) { 138 | canvas.style.display = "none"; 139 | fadeTimerId = null; 140 | return; 141 | } 142 | } 143 | fadeTimerId = window.requestAnimationFrame(loop); 144 | })(); 145 | }, 146 | }; 147 | 148 | if (typeof module === "object" && typeof module.exports === "object") { 149 | module.exports = topbar; 150 | } else if (typeof define === "function" && define.amd) { 151 | define(function () { 152 | return topbar; 153 | }); 154 | } else { 155 | this.topbar = topbar; 156 | } 157 | }.call(this, window, document)); 158 | -------------------------------------------------------------------------------- /apps/hello_web/lib/hello_web.ex: -------------------------------------------------------------------------------- 1 | defmodule HelloWeb do 2 | @moduledoc """ 3 | The entrypoint for defining your web interface, such 4 | as controllers, views, channels and so on. 5 | 6 | This can be used in your application as: 7 | 8 | use HelloWeb, :controller 9 | use HelloWeb, :view 10 | 11 | The definitions below will be executed for every view, 12 | controller, etc, so keep them short and clean, focused 13 | on imports, uses and aliases. 14 | 15 | Do NOT define functions inside the quoted expressions 16 | below. Instead, define any helper function in modules 17 | and import those modules here. 18 | """ 19 | 20 | def controller do 21 | quote do 22 | use Phoenix.Controller, namespace: HelloWeb 23 | 24 | import Plug.Conn 25 | import HelloWeb.Gettext 26 | alias HelloWeb.Router.Helpers, as: Routes 27 | end 28 | end 29 | 30 | def view do 31 | quote do 32 | use Phoenix.View, 33 | root: "lib/hello_web/templates", 34 | namespace: HelloWeb 35 | 36 | # Import convenience functions from controllers 37 | import Phoenix.Controller, 38 | only: [get_flash: 1, get_flash: 2, view_module: 1, view_template: 1] 39 | 40 | # Include shared imports and aliases for views 41 | unquote(view_helpers()) 42 | end 43 | end 44 | 45 | def live_view do 46 | quote do 47 | use Phoenix.LiveView, 48 | layout: {HelloWeb.LayoutView, "live.html"} 49 | 50 | unquote(view_helpers()) 51 | end 52 | end 53 | 54 | def live_component do 55 | quote do 56 | use Phoenix.LiveComponent 57 | 58 | unquote(view_helpers()) 59 | end 60 | end 61 | 62 | def component do 63 | quote do 64 | use Phoenix.Component 65 | 66 | unquote(view_helpers()) 67 | end 68 | end 69 | 70 | def router do 71 | quote do 72 | use Phoenix.Router 73 | 74 | import Plug.Conn 75 | import Phoenix.Controller 76 | import Phoenix.LiveView.Router 77 | end 78 | end 79 | 80 | def channel do 81 | quote do 82 | use Phoenix.Channel 83 | import HelloWeb.Gettext 84 | end 85 | end 86 | 87 | defp view_helpers do 88 | quote do 89 | # Use all HTML functionality (forms, tags, etc) 90 | use Phoenix.HTML 91 | 92 | # Import LiveView and .heex helpers (live_render, live_patch, <.form>, etc) 93 | import Phoenix.LiveView.Helpers 94 | 95 | # Import basic rendering functionality (render, render_layout, etc) 96 | import Phoenix.View 97 | 98 | import HelloWeb.ErrorHelpers 99 | import HelloWeb.Gettext 100 | alias HelloWeb.Router.Helpers, as: Routes 101 | end 102 | end 103 | 104 | @doc """ 105 | When used, dispatch to the appropriate controller/view/etc. 106 | """ 107 | defmacro __using__(which) when is_atom(which) do 108 | apply(__MODULE__, which, []) 109 | end 110 | end 111 | -------------------------------------------------------------------------------- /apps/hello_web/lib/hello_web/application.ex: -------------------------------------------------------------------------------- 1 | defmodule HelloWeb.Application do 2 | # See https://hexdocs.pm/elixir/Application.html 3 | # for more information on OTP Applications 4 | @moduledoc false 5 | 6 | use Application 7 | 8 | @impl true 9 | def start(_type, _args) do 10 | children = [ 11 | # Start the Telemetry supervisor 12 | HelloWeb.Telemetry, 13 | # Start the Endpoint (http/https) 14 | HelloWeb.Endpoint 15 | # Start a worker by calling: HelloWeb.Worker.start_link(arg) 16 | # {HelloWeb.Worker, arg} 17 | ] 18 | 19 | # See https://hexdocs.pm/elixir/Supervisor.html 20 | # for other strategies and supported options 21 | opts = [strategy: :one_for_one, name: HelloWeb.Supervisor] 22 | Supervisor.start_link(children, opts) 23 | end 24 | 25 | # Tell Phoenix to update the endpoint configuration 26 | # whenever the application is updated. 27 | @impl true 28 | def config_change(changed, _new, removed) do 29 | HelloWeb.Endpoint.config_change(changed, removed) 30 | :ok 31 | end 32 | end 33 | -------------------------------------------------------------------------------- /apps/hello_web/lib/hello_web/controllers/page_controller.ex: -------------------------------------------------------------------------------- 1 | defmodule HelloWeb.PageController do 2 | use HelloWeb, :controller 3 | 4 | def index(conn, _params) do 5 | render(conn, "index.html") 6 | end 7 | end 8 | -------------------------------------------------------------------------------- /apps/hello_web/lib/hello_web/endpoint.ex: -------------------------------------------------------------------------------- 1 | defmodule HelloWeb.Endpoint do 2 | use Phoenix.Endpoint, otp_app: :hello_web 3 | 4 | # The session will be stored in the cookie and signed, 5 | # this means its contents can be read but not tampered with. 6 | # Set :encryption_salt if you would also like to encrypt it. 7 | @session_options [ 8 | store: :cookie, 9 | key: "_hello_web_key", 10 | signing_salt: "640NV1Xr" 11 | ] 12 | 13 | socket "/live", Phoenix.LiveView.Socket, websocket: [connect_info: [session: @session_options]] 14 | 15 | # Serve at "/" the static files from "priv/static" directory. 16 | # 17 | # You should set gzip to true if you are running phx.digest 18 | # when deploying your static files in production. 19 | plug Plug.Static, 20 | at: "/", 21 | from: :hello_web, 22 | gzip: false, 23 | only: ~w(assets fonts images favicon.ico robots.txt) 24 | 25 | # Code reloading can be explicitly enabled under the 26 | # :code_reloader configuration of your endpoint. 27 | if code_reloading? do 28 | socket "/phoenix/live_reload/socket", Phoenix.LiveReloader.Socket 29 | plug Phoenix.LiveReloader 30 | plug Phoenix.CodeReloader 31 | plug Phoenix.Ecto.CheckRepoStatus, otp_app: :hello_web 32 | end 33 | 34 | plug Phoenix.LiveDashboard.RequestLogger, 35 | param_key: "request_logger", 36 | cookie_key: "request_logger" 37 | 38 | plug Plug.RequestId 39 | plug Plug.Telemetry, event_prefix: [:phoenix, :endpoint] 40 | 41 | plug Plug.Parsers, 42 | parsers: [:urlencoded, :multipart, :json], 43 | pass: ["*/*"], 44 | json_decoder: Phoenix.json_library() 45 | 46 | plug Plug.MethodOverride 47 | plug Plug.Head 48 | plug Plug.Session, @session_options 49 | plug HelloWeb.Router 50 | end 51 | -------------------------------------------------------------------------------- /apps/hello_web/lib/hello_web/gettext.ex: -------------------------------------------------------------------------------- 1 | defmodule HelloWeb.Gettext do 2 | @moduledoc """ 3 | A module providing Internationalization with a gettext-based API. 4 | 5 | By using [Gettext](https://hexdocs.pm/gettext), 6 | your module gains a set of macros for translations, for example: 7 | 8 | import HelloWeb.Gettext 9 | 10 | # Simple translation 11 | gettext("Here is the string to translate") 12 | 13 | # Plural translation 14 | ngettext("Here is the string to translate", 15 | "Here are the strings to translate", 16 | 3) 17 | 18 | # Domain-based translation 19 | dgettext("errors", "Here is the error message to translate") 20 | 21 | See the [Gettext Docs](https://hexdocs.pm/gettext) for detailed usage. 22 | """ 23 | use Gettext, otp_app: :hello_web 24 | end 25 | -------------------------------------------------------------------------------- /apps/hello_web/lib/hello_web/release.ex: -------------------------------------------------------------------------------- 1 | defmodule HelloWeb.Release do 2 | @moduledoc """ 3 | Used for executing DB release tasks when run in production without Mix 4 | installed. 5 | """ 6 | @app :hello_web 7 | 8 | def migrate do 9 | load_app() 10 | 11 | for repo <- repos() do 12 | {:ok, _, _} = Ecto.Migrator.with_repo(repo, &Ecto.Migrator.run(&1, :up, all: true)) 13 | end 14 | end 15 | 16 | def rollback(repo, version) do 17 | load_app() 18 | {:ok, _, _} = Ecto.Migrator.with_repo(repo, &Ecto.Migrator.run(&1, :down, to: version)) 19 | end 20 | 21 | defp repos do 22 | Application.fetch_env!(@app, :ecto_repos) 23 | end 24 | 25 | defp load_app do 26 | Application.load(@app) 27 | end 28 | end 29 | -------------------------------------------------------------------------------- /apps/hello_web/lib/hello_web/router.ex: -------------------------------------------------------------------------------- 1 | defmodule HelloWeb.Router do 2 | use HelloWeb, :router 3 | 4 | pipeline :browser do 5 | plug :accepts, ["html"] 6 | plug :fetch_session 7 | plug :fetch_live_flash 8 | plug :put_root_layout, {HelloWeb.LayoutView, :root} 9 | plug :protect_from_forgery 10 | plug :put_secure_browser_headers 11 | end 12 | 13 | pipeline :api do 14 | plug :accepts, ["json"] 15 | end 16 | 17 | scope "/", HelloWeb do 18 | pipe_through :browser 19 | 20 | get "/", PageController, :index 21 | end 22 | 23 | # Other scopes may use custom stacks. 24 | # scope "/api", HelloWeb do 25 | # pipe_through :api 26 | # end 27 | 28 | # Enables LiveDashboard only for development 29 | # 30 | # If you want to use the LiveDashboard in production, you should put 31 | # it behind authentication and allow only admins to access it. 32 | # If your application does not have an admins-only section yet, 33 | # you can use Plug.BasicAuth to set up some basic authentication 34 | # as long as you are also using SSL (which you should anyway). 35 | if Mix.env() in [:dev, :test] do 36 | import Phoenix.LiveDashboard.Router 37 | 38 | scope "/" do 39 | pipe_through :browser 40 | 41 | live_dashboard "/dashboard", metrics: HelloWeb.Telemetry 42 | end 43 | end 44 | 45 | # Enables the Swoosh mailbox preview in development. 46 | # 47 | # Note that preview only shows emails that were sent by the same 48 | # node running the Phoenix server. 49 | if Mix.env() == :dev do 50 | scope "/dev" do 51 | pipe_through :browser 52 | 53 | forward "/mailbox", Plug.Swoosh.MailboxPreview 54 | end 55 | end 56 | end 57 | -------------------------------------------------------------------------------- /apps/hello_web/lib/hello_web/telemetry.ex: -------------------------------------------------------------------------------- 1 | defmodule HelloWeb.Telemetry do 2 | use Supervisor 3 | import Telemetry.Metrics 4 | 5 | def start_link(arg) do 6 | Supervisor.start_link(__MODULE__, arg, name: __MODULE__) 7 | end 8 | 9 | @impl true 10 | def init(_arg) do 11 | children = [ 12 | # Telemetry poller will execute the given period measurements 13 | # every 10_000ms. Learn more here: https://hexdocs.pm/telemetry_metrics 14 | {:telemetry_poller, measurements: periodic_measurements(), period: 10_000} 15 | # Add reporters as children of your supervision tree. 16 | # {Telemetry.Metrics.ConsoleReporter, metrics: metrics()} 17 | ] 18 | 19 | Supervisor.init(children, strategy: :one_for_one) 20 | end 21 | 22 | def metrics do 23 | [ 24 | # Phoenix Metrics 25 | summary("phoenix.endpoint.stop.duration", 26 | unit: {:native, :millisecond} 27 | ), 28 | summary("phoenix.router_dispatch.stop.duration", 29 | tags: [:route], 30 | unit: {:native, :millisecond} 31 | ), 32 | 33 | # Database Metrics 34 | summary("hello.repo.query.total_time", 35 | unit: {:native, :millisecond}, 36 | description: "The sum of the other measurements" 37 | ), 38 | summary("hello.repo.query.decode_time", 39 | unit: {:native, :millisecond}, 40 | description: "The time spent decoding the data received from the database" 41 | ), 42 | summary("hello.repo.query.query_time", 43 | unit: {:native, :millisecond}, 44 | description: "The time spent executing the query" 45 | ), 46 | summary("hello.repo.query.queue_time", 47 | unit: {:native, :millisecond}, 48 | description: "The time spent waiting for a database connection" 49 | ), 50 | summary("hello.repo.query.idle_time", 51 | unit: {:native, :millisecond}, 52 | description: 53 | "The time the connection spent waiting before being checked out for the query" 54 | ), 55 | 56 | # VM Metrics 57 | summary("vm.memory.total", unit: {:byte, :kilobyte}), 58 | summary("vm.total_run_queue_lengths.total"), 59 | summary("vm.total_run_queue_lengths.cpu"), 60 | summary("vm.total_run_queue_lengths.io") 61 | ] 62 | end 63 | 64 | defp periodic_measurements do 65 | [ 66 | # A module, function and arguments to be invoked periodically. 67 | # This function must call :telemetry.execute/3 and a metric must be added above. 68 | # {HelloWeb, :count_users, []} 69 | ] 70 | end 71 | end 72 | -------------------------------------------------------------------------------- /apps/hello_web/lib/hello_web/templates/layout/app.html.heex: -------------------------------------------------------------------------------- 1 |
2 | 3 | 4 | <%= @inner_content %> 5 |
6 | -------------------------------------------------------------------------------- /apps/hello_web/lib/hello_web/templates/layout/live.html.heex: -------------------------------------------------------------------------------- 1 |
2 | 5 | 6 | 9 | 10 | <%= @inner_content %> 11 |
12 | -------------------------------------------------------------------------------- /apps/hello_web/lib/hello_web/templates/layout/root.html.heex: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <%= csrf_meta_tag() %> 8 | <%= live_title_tag assigns[:page_title] || "Hello", suffix: " · Phoenix Framework" %> 9 | 10 | 11 | 12 | 13 |
14 |
15 | 23 | 26 |
27 |
28 | <%= @inner_content %> 29 | 30 | 31 | -------------------------------------------------------------------------------- /apps/hello_web/lib/hello_web/templates/page/index.html.heex: -------------------------------------------------------------------------------- 1 |
2 | 3 |
4 | 18 | 38 |
39 | -------------------------------------------------------------------------------- /apps/hello_web/lib/hello_web/views/error_helpers.ex: -------------------------------------------------------------------------------- 1 | defmodule HelloWeb.ErrorHelpers do 2 | @moduledoc """ 3 | Conveniences for translating and building error messages. 4 | """ 5 | 6 | use Phoenix.HTML 7 | 8 | @doc """ 9 | Generates tag for inlined form input errors. 10 | """ 11 | def error_tag(form, field) do 12 | Enum.map(Keyword.get_values(form.errors, field), fn error -> 13 | content_tag(:span, translate_error(error), 14 | class: "invalid-feedback", 15 | phx_feedback_for: input_name(form, field) 16 | ) 17 | end) 18 | end 19 | 20 | @doc """ 21 | Translates an error message using gettext. 22 | """ 23 | def translate_error({msg, opts}) do 24 | # When using gettext, we typically pass the strings we want 25 | # to translate as a static argument: 26 | # 27 | # # Translate "is invalid" in the "errors" domain 28 | # dgettext("errors", "is invalid") 29 | # 30 | # # Translate the number of files with plural rules 31 | # dngettext("errors", "1 file", "%{count} files", count) 32 | # 33 | # Because the error messages we show in our forms and APIs 34 | # are defined inside Ecto, we need to translate them dynamically. 35 | # This requires us to call the Gettext module passing our gettext 36 | # backend as first argument. 37 | # 38 | # Note we use the "errors" domain, which means translations 39 | # should be written to the errors.po file. The :count option is 40 | # set by Ecto and indicates we should also apply plural rules. 41 | if count = opts[:count] do 42 | Gettext.dngettext(HelloWeb.Gettext, "errors", msg, msg, count, opts) 43 | else 44 | Gettext.dgettext(HelloWeb.Gettext, "errors", msg, opts) 45 | end 46 | end 47 | end 48 | -------------------------------------------------------------------------------- /apps/hello_web/lib/hello_web/views/error_view.ex: -------------------------------------------------------------------------------- 1 | defmodule HelloWeb.ErrorView do 2 | use HelloWeb, :view 3 | 4 | # If you want to customize a particular status code 5 | # for a certain format, you may uncomment below. 6 | # def render("500.html", _assigns) do 7 | # "Internal Server Error" 8 | # end 9 | 10 | # By default, Phoenix returns the status message from 11 | # the template name. For example, "404.html" becomes 12 | # "Not Found". 13 | def template_not_found(template, _assigns) do 14 | Phoenix.Controller.status_message_from_template(template) 15 | end 16 | end 17 | -------------------------------------------------------------------------------- /apps/hello_web/lib/hello_web/views/layout_view.ex: -------------------------------------------------------------------------------- 1 | defmodule HelloWeb.LayoutView do 2 | use HelloWeb, :view 3 | 4 | # Phoenix LiveDashboard is available only in development by default, 5 | # so we instruct Elixir to not warn if the dashboard route is missing. 6 | @compile {:no_warn_undefined, {Routes, :live_dashboard_path, 2}} 7 | end 8 | -------------------------------------------------------------------------------- /apps/hello_web/lib/hello_web/views/page_view.ex: -------------------------------------------------------------------------------- 1 | defmodule HelloWeb.PageView do 2 | use HelloWeb, :view 3 | end 4 | -------------------------------------------------------------------------------- /apps/hello_web/mix.exs: -------------------------------------------------------------------------------- 1 | defmodule HelloWeb.MixProject do 2 | use Mix.Project 3 | 4 | def project do 5 | [ 6 | app: :hello_web, 7 | version: "0.1.0", 8 | build_path: "../../_build", 9 | config_path: "../../config/config.exs", 10 | deps_path: "../../deps", 11 | lockfile: "../../mix.lock", 12 | elixir: "~> 1.12", 13 | elixirc_paths: elixirc_paths(Mix.env()), 14 | compilers: [:gettext] ++ Mix.compilers(), 15 | start_permanent: Mix.env() == :prod, 16 | aliases: aliases(), 17 | deps: deps() 18 | ] 19 | end 20 | 21 | # Configuration for the OTP application. 22 | # 23 | # Type `mix help compile.app` for more information. 24 | def application do 25 | [ 26 | mod: {HelloWeb.Application, []}, 27 | extra_applications: [:logger, :runtime_tools] 28 | ] 29 | end 30 | 31 | # Specifies which paths to compile per environment. 32 | defp elixirc_paths(:test), do: ["lib", "test/support"] 33 | defp elixirc_paths(_), do: ["lib"] 34 | 35 | # Specifies your project dependencies. 36 | # 37 | # Type `mix help deps` for examples and options. 38 | defp deps do 39 | [ 40 | {:phoenix, "~> 1.6.5"}, 41 | {:phoenix_ecto, "~> 4.4"}, 42 | {:phoenix_html, "~> 3.0"}, 43 | {:phoenix_live_reload, "~> 1.2", only: :dev}, 44 | {:phoenix_live_view, "~> 0.17.5"}, 45 | {:floki, ">= 0.30.0", only: :test}, 46 | {:phoenix_live_dashboard, "~> 0.6"}, 47 | {:esbuild, "~> 0.3", runtime: Mix.env() == :dev}, 48 | {:telemetry_metrics, "~> 0.6"}, 49 | {:telemetry_poller, "~> 1.0"}, 50 | {:gettext, "~> 0.18"}, 51 | {:hello, in_umbrella: true}, 52 | {:jason, "~> 1.2"}, 53 | {:plug_cowboy, "~> 2.5"} 54 | ] 55 | end 56 | 57 | # Aliases are shortcuts or tasks specific to the current project. 58 | # 59 | # See the documentation for `Mix` for more info on aliases. 60 | defp aliases do 61 | [ 62 | setup: ["deps.get"], 63 | test: ["ecto.create --quiet", "ecto.migrate --quiet", "test"], 64 | "assets.deploy": ["esbuild default --minify", "phx.digest"] 65 | ] 66 | end 67 | end 68 | -------------------------------------------------------------------------------- /apps/hello_web/priv/gettext/en/LC_MESSAGES/errors.po: -------------------------------------------------------------------------------- 1 | ## `msgid`s in this file come from POT (.pot) files. 2 | ## 3 | ## Do not add, change, or remove `msgid`s manually here as 4 | ## they're tied to the ones in the corresponding POT file 5 | ## (with the same domain). 6 | ## 7 | ## Use `mix gettext.extract --merge` or `mix gettext.merge` 8 | ## to merge POT files into PO files. 9 | msgid "" 10 | msgstr "" 11 | "Language: en\n" 12 | 13 | ## From Ecto.Changeset.cast/4 14 | msgid "can't be blank" 15 | msgstr "" 16 | 17 | ## From Ecto.Changeset.unique_constraint/3 18 | msgid "has already been taken" 19 | msgstr "" 20 | 21 | ## From Ecto.Changeset.put_change/3 22 | msgid "is invalid" 23 | msgstr "" 24 | 25 | ## From Ecto.Changeset.validate_acceptance/3 26 | msgid "must be accepted" 27 | msgstr "" 28 | 29 | ## From Ecto.Changeset.validate_format/3 30 | msgid "has invalid format" 31 | msgstr "" 32 | 33 | ## From Ecto.Changeset.validate_subset/3 34 | msgid "has an invalid entry" 35 | msgstr "" 36 | 37 | ## From Ecto.Changeset.validate_exclusion/3 38 | msgid "is reserved" 39 | msgstr "" 40 | 41 | ## From Ecto.Changeset.validate_confirmation/3 42 | msgid "does not match confirmation" 43 | msgstr "" 44 | 45 | ## From Ecto.Changeset.no_assoc_constraint/3 46 | msgid "is still associated with this entry" 47 | msgstr "" 48 | 49 | msgid "are still associated with this entry" 50 | msgstr "" 51 | 52 | ## From Ecto.Changeset.validate_length/3 53 | msgid "should have %{count} item(s)" 54 | msgid_plural "should have %{count} item(s)" 55 | msgstr[0] "" 56 | msgstr[1] "" 57 | 58 | msgid "should be %{count} character(s)" 59 | msgid_plural "should be %{count} character(s)" 60 | msgstr[0] "" 61 | msgstr[1] "" 62 | 63 | msgid "should be %{count} byte(s)" 64 | msgid_plural "should be %{count} byte(s)" 65 | msgstr[0] "" 66 | msgstr[1] "" 67 | 68 | msgid "should have at least %{count} item(s)" 69 | msgid_plural "should have at least %{count} item(s)" 70 | msgstr[0] "" 71 | msgstr[1] "" 72 | 73 | msgid "should be at least %{count} character(s)" 74 | msgid_plural "should be at least %{count} character(s)" 75 | msgstr[0] "" 76 | msgstr[1] "" 77 | 78 | msgid "should be at least %{count} byte(s)" 79 | msgid_plural "should be at least %{count} byte(s)" 80 | msgstr[0] "" 81 | msgstr[1] "" 82 | 83 | msgid "should have at most %{count} item(s)" 84 | msgid_plural "should have at most %{count} item(s)" 85 | msgstr[0] "" 86 | msgstr[1] "" 87 | 88 | msgid "should be at most %{count} character(s)" 89 | msgid_plural "should be at most %{count} character(s)" 90 | msgstr[0] "" 91 | msgstr[1] "" 92 | 93 | msgid "should be at most %{count} byte(s)" 94 | msgid_plural "should be at most %{count} byte(s)" 95 | msgstr[0] "" 96 | msgstr[1] "" 97 | 98 | ## From Ecto.Changeset.validate_number/3 99 | msgid "must be less than %{number}" 100 | msgstr "" 101 | 102 | msgid "must be greater than %{number}" 103 | msgstr "" 104 | 105 | msgid "must be less than or equal to %{number}" 106 | msgstr "" 107 | 108 | msgid "must be greater than or equal to %{number}" 109 | msgstr "" 110 | 111 | msgid "must be equal to %{number}" 112 | msgstr "" 113 | -------------------------------------------------------------------------------- /apps/hello_web/priv/gettext/errors.pot: -------------------------------------------------------------------------------- 1 | ## This is a PO Template file. 2 | ## 3 | ## `msgid`s here are often extracted from source code. 4 | ## Add new translations manually only if they're dynamic 5 | ## translations that can't be statically extracted. 6 | ## 7 | ## Run `mix gettext.extract` to bring this file up to 8 | ## date. Leave `msgstr`s empty as changing them here has no 9 | ## effect: edit them in PO (`.po`) files instead. 10 | 11 | ## From Ecto.Changeset.cast/4 12 | msgid "can't be blank" 13 | msgstr "" 14 | 15 | ## From Ecto.Changeset.unique_constraint/3 16 | msgid "has already been taken" 17 | msgstr "" 18 | 19 | ## From Ecto.Changeset.put_change/3 20 | msgid "is invalid" 21 | msgstr "" 22 | 23 | ## From Ecto.Changeset.validate_acceptance/3 24 | msgid "must be accepted" 25 | msgstr "" 26 | 27 | ## From Ecto.Changeset.validate_format/3 28 | msgid "has invalid format" 29 | msgstr "" 30 | 31 | ## From Ecto.Changeset.validate_subset/3 32 | msgid "has an invalid entry" 33 | msgstr "" 34 | 35 | ## From Ecto.Changeset.validate_exclusion/3 36 | msgid "is reserved" 37 | msgstr "" 38 | 39 | ## From Ecto.Changeset.validate_confirmation/3 40 | msgid "does not match confirmation" 41 | msgstr "" 42 | 43 | ## From Ecto.Changeset.no_assoc_constraint/3 44 | msgid "is still associated with this entry" 45 | msgstr "" 46 | 47 | msgid "are still associated with this entry" 48 | msgstr "" 49 | 50 | ## From Ecto.Changeset.validate_length/3 51 | msgid "should be %{count} character(s)" 52 | msgid_plural "should be %{count} character(s)" 53 | msgstr[0] "" 54 | msgstr[1] "" 55 | 56 | msgid "should have %{count} item(s)" 57 | msgid_plural "should have %{count} item(s)" 58 | msgstr[0] "" 59 | msgstr[1] "" 60 | 61 | msgid "should be at least %{count} character(s)" 62 | msgid_plural "should be at least %{count} character(s)" 63 | msgstr[0] "" 64 | msgstr[1] "" 65 | 66 | msgid "should have at least %{count} item(s)" 67 | msgid_plural "should have at least %{count} item(s)" 68 | msgstr[0] "" 69 | msgstr[1] "" 70 | 71 | msgid "should be at most %{count} character(s)" 72 | msgid_plural "should be at most %{count} character(s)" 73 | msgstr[0] "" 74 | msgstr[1] "" 75 | 76 | msgid "should have at most %{count} item(s)" 77 | msgid_plural "should have at most %{count} item(s)" 78 | msgstr[0] "" 79 | msgstr[1] "" 80 | 81 | ## From Ecto.Changeset.validate_number/3 82 | msgid "must be less than %{number}" 83 | msgstr "" 84 | 85 | msgid "must be greater than %{number}" 86 | msgstr "" 87 | 88 | msgid "must be less than or equal to %{number}" 89 | msgstr "" 90 | 91 | msgid "must be greater than or equal to %{number}" 92 | msgstr "" 93 | 94 | msgid "must be equal to %{number}" 95 | msgstr "" 96 | -------------------------------------------------------------------------------- /apps/hello_web/priv/static/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/aisrael/elixir-phoenix-typescript-react/719a42e958f80bd483cae5e5eef04c7d69666092/apps/hello_web/priv/static/favicon.ico -------------------------------------------------------------------------------- /apps/hello_web/priv/static/images/phoenix.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/aisrael/elixir-phoenix-typescript-react/719a42e958f80bd483cae5e5eef04c7d69666092/apps/hello_web/priv/static/images/phoenix.png -------------------------------------------------------------------------------- /apps/hello_web/priv/static/robots.txt: -------------------------------------------------------------------------------- 1 | # See https://www.robotstxt.org/robotstxt.html for documentation on how to use the robots.txt file 2 | # 3 | # To ban all spiders from the entire site uncomment the next two lines: 4 | # User-agent: * 5 | # Disallow: / 6 | -------------------------------------------------------------------------------- /apps/hello_web/rel/overlays/bin/migrate: -------------------------------------------------------------------------------- 1 | #!/bin/sh 2 | cd -P -- "$(dirname -- "$0")" 3 | exec ./hello_web eval HelloWeb.Release.migrate -------------------------------------------------------------------------------- /apps/hello_web/rel/overlays/bin/migrate.bat: -------------------------------------------------------------------------------- 1 | call "%~dp0\hello_web" eval HelloWeb.Release.migrate -------------------------------------------------------------------------------- /apps/hello_web/rel/overlays/bin/server: -------------------------------------------------------------------------------- 1 | #!/bin/sh 2 | cd -P -- "$(dirname -- "$0")" 3 | PHX_SERVER=true exec ./hello_web start 4 | -------------------------------------------------------------------------------- /apps/hello_web/rel/overlays/bin/server.bat: -------------------------------------------------------------------------------- 1 | set PHX_SERVER=true 2 | call "%~dp0\hello_web" start -------------------------------------------------------------------------------- /apps/hello_web/test/hello_web/controllers/page_controller_test.exs: -------------------------------------------------------------------------------- 1 | defmodule HelloWeb.PageControllerTest do 2 | use HelloWeb.ConnCase 3 | 4 | test "GET /", %{conn: conn} do 5 | conn = get(conn, "/") 6 | assert html_response(conn, 200) =~ "Welcome to Phoenix!" 7 | end 8 | end 9 | -------------------------------------------------------------------------------- /apps/hello_web/test/hello_web/views/error_view_test.exs: -------------------------------------------------------------------------------- 1 | defmodule HelloWeb.ErrorViewTest do 2 | use HelloWeb.ConnCase, async: true 3 | 4 | # Bring render/3 and render_to_string/3 for testing custom views 5 | import Phoenix.View 6 | 7 | test "renders 404.html" do 8 | assert render_to_string(HelloWeb.ErrorView, "404.html", []) == "Not Found" 9 | end 10 | 11 | test "renders 500.html" do 12 | assert render_to_string(HelloWeb.ErrorView, "500.html", []) == "Internal Server Error" 13 | end 14 | end 15 | -------------------------------------------------------------------------------- /apps/hello_web/test/hello_web/views/layout_view_test.exs: -------------------------------------------------------------------------------- 1 | defmodule HelloWeb.LayoutViewTest do 2 | use HelloWeb.ConnCase, async: true 3 | 4 | # When testing helpers, you may want to import Phoenix.HTML and 5 | # use functions such as safe_to_string() to convert the helper 6 | # result into an HTML string. 7 | # import Phoenix.HTML 8 | end 9 | -------------------------------------------------------------------------------- /apps/hello_web/test/hello_web/views/page_view_test.exs: -------------------------------------------------------------------------------- 1 | defmodule HelloWeb.PageViewTest do 2 | use HelloWeb.ConnCase, async: true 3 | end 4 | -------------------------------------------------------------------------------- /apps/hello_web/test/support/channel_case.ex: -------------------------------------------------------------------------------- 1 | defmodule HelloWeb.ChannelCase do 2 | @moduledoc """ 3 | This module defines the test case to be used by 4 | channel tests. 5 | 6 | Such tests rely on `Phoenix.ChannelTest` and also 7 | import other functionality to make it easier 8 | to build common data structures and query the data layer. 9 | 10 | Finally, if the test case interacts with the database, 11 | we enable the SQL sandbox, so changes done to the database 12 | are reverted at the end of every test. If you are using 13 | PostgreSQL, you can even run database tests asynchronously 14 | by setting `use HelloWeb.ChannelCase, async: true`, although 15 | this option is not recommended for other databases. 16 | """ 17 | 18 | use ExUnit.CaseTemplate 19 | 20 | using do 21 | quote do 22 | # Import conveniences for testing with channels 23 | import Phoenix.ChannelTest 24 | import HelloWeb.ChannelCase 25 | 26 | # The default endpoint for testing 27 | @endpoint HelloWeb.Endpoint 28 | end 29 | end 30 | 31 | setup tags do 32 | pid = Ecto.Adapters.SQL.Sandbox.start_owner!(Hello.Repo, shared: not tags[:async]) 33 | on_exit(fn -> Ecto.Adapters.SQL.Sandbox.stop_owner(pid) end) 34 | :ok 35 | end 36 | end 37 | -------------------------------------------------------------------------------- /apps/hello_web/test/support/conn_case.ex: -------------------------------------------------------------------------------- 1 | defmodule HelloWeb.ConnCase do 2 | @moduledoc """ 3 | This module defines the test case to be used by 4 | tests that require setting up a connection. 5 | 6 | Such tests rely on `Phoenix.ConnTest` and also 7 | import other functionality to make it easier 8 | to build common data structures and query the data layer. 9 | 10 | Finally, if the test case interacts with the database, 11 | we enable the SQL sandbox, so changes done to the database 12 | are reverted at the end of every test. If you are using 13 | PostgreSQL, you can even run database tests asynchronously 14 | by setting `use HelloWeb.ConnCase, async: true`, although 15 | this option is not recommended for other databases. 16 | """ 17 | 18 | use ExUnit.CaseTemplate 19 | 20 | using do 21 | quote do 22 | # Import conveniences for testing with connections 23 | import Plug.Conn 24 | import Phoenix.ConnTest 25 | import HelloWeb.ConnCase 26 | 27 | alias HelloWeb.Router.Helpers, as: Routes 28 | 29 | # The default endpoint for testing 30 | @endpoint HelloWeb.Endpoint 31 | end 32 | end 33 | 34 | setup tags do 35 | pid = Ecto.Adapters.SQL.Sandbox.start_owner!(Hello.Repo, shared: not tags[:async]) 36 | on_exit(fn -> Ecto.Adapters.SQL.Sandbox.stop_owner(pid) end) 37 | {:ok, conn: Phoenix.ConnTest.build_conn()} 38 | end 39 | end 40 | -------------------------------------------------------------------------------- /apps/hello_web/test/test_helper.exs: -------------------------------------------------------------------------------- 1 | ExUnit.start() 2 | Ecto.Adapters.SQL.Sandbox.mode(Hello.Repo, :manual) 3 | -------------------------------------------------------------------------------- /config/config.exs: -------------------------------------------------------------------------------- 1 | # This file is responsible for configuring your umbrella 2 | # and **all applications** and their dependencies with the 3 | # help of the Config module. 4 | # 5 | # Note that all applications in your umbrella share the 6 | # same configuration and dependencies, which is why they 7 | # all use the same configuration file. If you want different 8 | # configurations or dependencies per app, it is best to 9 | # move said applications out of the umbrella. 10 | import Config 11 | 12 | # Configure Mix tasks and generators 13 | config :hello, 14 | ecto_repos: [Hello.Repo] 15 | 16 | # Configures the mailer 17 | # 18 | # By default it uses the "Local" adapter which stores the emails 19 | # locally. You can see the emails in your browser, at "/dev/mailbox". 20 | # 21 | # For production it's recommended to configure a different adapter 22 | # at the `config/runtime.exs`. 23 | config :hello, Hello.Mailer, adapter: Swoosh.Adapters.Local 24 | 25 | # Swoosh API client is needed for adapters other than SMTP. 26 | config :swoosh, :api_client, false 27 | 28 | config :hello_web, 29 | ecto_repos: [Hello.Repo], 30 | generators: [context_app: :hello] 31 | 32 | # Configures the endpoint 33 | config :hello_web, HelloWeb.Endpoint, 34 | url: [host: "localhost"], 35 | render_errors: [view: HelloWeb.ErrorView, accepts: ~w(html json), layout: false], 36 | pubsub_server: Hello.PubSub, 37 | live_view: [signing_salt: "CB4Jsmaq"] 38 | 39 | # Configure esbuild (the version is required) 40 | config :esbuild, 41 | version: "0.14.0", 42 | default: [ 43 | args: 44 | ~w(js/app.jsx --bundle --target=es2017 --outdir=../priv/static/assets --external:/fonts/* --external:/images/*), 45 | cd: Path.expand("../apps/hello_web/assets", __DIR__), 46 | env: %{"NODE_PATH" => Path.expand("../deps", __DIR__)} 47 | ] 48 | 49 | # Configures Elixir's Logger 50 | config :logger, :console, 51 | format: "$time $metadata[$level] $message\n", 52 | metadata: [:request_id] 53 | 54 | # Use Jason for JSON parsing in Phoenix 55 | config :phoenix, :json_library, Jason 56 | 57 | # Import environment specific config. This must remain at the bottom 58 | # of this file so it overrides the configuration defined above. 59 | import_config "#{config_env()}.exs" 60 | -------------------------------------------------------------------------------- /config/dev.exs: -------------------------------------------------------------------------------- 1 | import Config 2 | 3 | # Configure your database 4 | config :hello, Hello.Repo, 5 | username: "postgres", 6 | password: "postgres", 7 | hostname: "localhost", 8 | database: "hello_dev", 9 | show_sensitive_data_on_connection_error: true, 10 | pool_size: 10 11 | 12 | # For development, we disable any cache and enable 13 | # debugging and code reloading. 14 | # 15 | # The watchers configuration can be used to run external 16 | # watchers to your application. For example, we use it 17 | # with esbuild to bundle .js and .css sources. 18 | config :hello_web, HelloWeb.Endpoint, 19 | # Binding to loopback ipv4 address prevents access from other machines. 20 | # Change to `ip: {0, 0, 0, 0}` to allow access from other machines. 21 | http: [ip: {127, 0, 0, 1}, port: 4000], 22 | check_origin: false, 23 | code_reloader: true, 24 | debug_errors: true, 25 | secret_key_base: "LPyjyD4J2DzhnJIxc8wTRK524yLMKdWhRZr5LuTPynD2bqYG4KHmAU+u6GRg+gob", 26 | watchers: [ 27 | # Start the esbuild watcher by calling Esbuild.install_and_run(:default, args) 28 | esbuild: {Esbuild, :install_and_run, [:default, ~w(--sourcemap=inline --watch)]} 29 | ] 30 | 31 | # ## SSL Support 32 | # 33 | # In order to use HTTPS in development, a self-signed 34 | # certificate can be generated by running the following 35 | # Mix task: 36 | # 37 | # mix phx.gen.cert 38 | # 39 | # Note that this task requires Erlang/OTP 20 or later. 40 | # Run `mix help phx.gen.cert` for more information. 41 | # 42 | # The `http:` config above can be replaced with: 43 | # 44 | # https: [ 45 | # port: 4001, 46 | # cipher_suite: :strong, 47 | # keyfile: "priv/cert/selfsigned_key.pem", 48 | # certfile: "priv/cert/selfsigned.pem" 49 | # ], 50 | # 51 | # If desired, both `http:` and `https:` keys can be 52 | # configured to run both http and https servers on 53 | # different ports. 54 | 55 | # Watch static and templates for browser reloading. 56 | config :hello_web, HelloWeb.Endpoint, 57 | live_reload: [ 58 | patterns: [ 59 | ~r"priv/static/.*(js|css|png|jpeg|jpg|gif|svg)$", 60 | ~r"priv/gettext/.*(po)$", 61 | ~r"lib/hello_web/(live|views)/.*(ex)$", 62 | ~r"lib/hello_web/templates/.*(eex)$" 63 | ] 64 | ] 65 | 66 | # Do not include metadata nor timestamps in development logs 67 | config :logger, :console, format: "[$level] $message\n" 68 | 69 | # Initialize plugs at runtime for faster development compilation 70 | config :phoenix, :plug_init_mode, :runtime 71 | 72 | # Set a higher stacktrace during development. Avoid configuring such 73 | # in production as building large stacktraces may be expensive. 74 | config :phoenix, :stacktrace_depth, 20 75 | -------------------------------------------------------------------------------- /config/prod.exs: -------------------------------------------------------------------------------- 1 | import Config 2 | 3 | # For production, don't forget to configure the url host 4 | # to something meaningful, Phoenix uses this information 5 | # when generating URLs. 6 | # 7 | # Note we also include the path to a cache manifest 8 | # containing the digested version of static files. This 9 | # manifest is generated by the `mix phx.digest` task, 10 | # which you should run after static files are built and 11 | # before starting your production server. 12 | config :hello_web, HelloWeb.Endpoint, 13 | url: [host: "example.com", port: 80], 14 | cache_static_manifest: "priv/static/cache_manifest.json" 15 | 16 | # ## SSL Support 17 | # 18 | # To get SSL working, you will need to add the `https` key 19 | # to the previous section and set your `:url` port to 443: 20 | # 21 | # config :hello_web, HelloWeb.Endpoint, 22 | # ..., 23 | # url: [host: "example.com", port: 443], 24 | # https: [ 25 | # ..., 26 | # port: 443, 27 | # cipher_suite: :strong, 28 | # keyfile: System.get_env("SOME_APP_SSL_KEY_PATH"), 29 | # certfile: System.get_env("SOME_APP_SSL_CERT_PATH") 30 | # ] 31 | # 32 | # The `cipher_suite` is set to `:strong` to support only the 33 | # latest and more secure SSL ciphers. This means old browsers 34 | # and clients may not be supported. You can set it to 35 | # `:compatible` for wider support. 36 | # 37 | # `:keyfile` and `:certfile` expect an absolute path to the key 38 | # and cert in disk or a relative path inside priv, for example 39 | # "priv/ssl/server.key". For all supported SSL configuration 40 | # options, see https://hexdocs.pm/plug/Plug.SSL.html#configure/1 41 | # 42 | # We also recommend setting `force_ssl` in your endpoint, ensuring 43 | # no data is ever sent via http, always redirecting to https: 44 | # 45 | # config :hello_web, HelloWeb.Endpoint, 46 | # force_ssl: [hsts: true] 47 | # 48 | # Check `Plug.SSL` for all available options in `force_ssl`. 49 | 50 | # Do not print debug messages in production 51 | config :logger, level: :info 52 | -------------------------------------------------------------------------------- /config/runtime.exs: -------------------------------------------------------------------------------- 1 | import Config 2 | 3 | # config/runtime.exs is executed for all environments, including 4 | # during releases. It is executed after compilation and before the 5 | # system starts, so it is typically used to load production configuration 6 | # and secrets from environment variables or elsewhere. Do not define 7 | # any compile-time configuration in here, as it won't be applied. 8 | # The block below contains prod specific runtime configuration. 9 | if config_env() == :prod do 10 | database_url = 11 | System.get_env("DATABASE_URL") || 12 | raise """ 13 | environment variable DATABASE_URL is missing. 14 | For example: ecto://USER:PASS@HOST/DATABASE 15 | """ 16 | 17 | maybe_ipv6 = if System.get_env("ECTO_IPV6"), do: [:inet6], else: [] 18 | 19 | config :hello, Hello.Repo, 20 | # ssl: true, 21 | url: database_url, 22 | pool_size: String.to_integer(System.get_env("POOL_SIZE") || "10"), 23 | socket_options: maybe_ipv6 24 | 25 | # The secret key base is used to sign/encrypt cookies and other secrets. 26 | # A default value is used in config/dev.exs and config/test.exs but you 27 | # want to use a different value for prod and you most likely don't want 28 | # to check this value into version control, so we use an environment 29 | # variable instead. 30 | secret_key_base = 31 | System.get_env("SECRET_KEY_BASE") || 32 | raise """ 33 | environment variable SECRET_KEY_BASE is missing. 34 | You can generate one by calling: mix phx.gen.secret 35 | """ 36 | 37 | config :hello_web, HelloWeb.Endpoint, 38 | http: [ 39 | # Enable IPv6 and bind on all interfaces. 40 | # Set it to {0, 0, 0, 0, 0, 0, 0, 1} for local network only access. 41 | ip: {0, 0, 0, 0, 0, 0, 0, 0}, 42 | port: String.to_integer(System.get_env("PORT") || "4000") 43 | ], 44 | secret_key_base: secret_key_base 45 | 46 | # ## Using releases 47 | # 48 | # If you are doing OTP releases, you need to instruct Phoenix 49 | # to start each relevant endpoint: 50 | 51 | config :hello_web, HelloWeb.Endpoint, server: true 52 | 53 | # Then you can assemble a release by calling `mix release`. 54 | # See `mix help release` for more information. 55 | 56 | # ## Configuring the mailer 57 | # 58 | # In production you need to configure the mailer to use a different adapter. 59 | # Also, you may need to configure the Swoosh API client of your choice if you 60 | # are not using SMTP. Here is an example of the configuration: 61 | # 62 | # config :hello, Hello.Mailer, 63 | # adapter: Swoosh.Adapters.Mailgun, 64 | # api_key: System.get_env("MAILGUN_API_KEY"), 65 | # domain: System.get_env("MAILGUN_DOMAIN") 66 | # 67 | # For this example you need include a HTTP client required by Swoosh API client. 68 | # Swoosh supports Hackney and Finch out of the box: 69 | # 70 | # config :swoosh, :api_client, Swoosh.ApiClient.Hackney 71 | # 72 | # See https://hexdocs.pm/swoosh/Swoosh.html#module-installation for details. 73 | end 74 | -------------------------------------------------------------------------------- /config/test.exs: -------------------------------------------------------------------------------- 1 | import Config 2 | 3 | # Configure your database 4 | # 5 | # The MIX_TEST_PARTITION environment variable can be used 6 | # to provide built-in test partitioning in CI environment. 7 | # Run `mix help test` for more information. 8 | config :hello, Hello.Repo, 9 | username: "postgres", 10 | password: "postgres", 11 | hostname: "localhost", 12 | database: "hello_test#{System.get_env("MIX_TEST_PARTITION")}", 13 | pool: Ecto.Adapters.SQL.Sandbox, 14 | pool_size: 10 15 | 16 | # We don't run a server during test. If one is required, 17 | # you can enable the server option below. 18 | config :hello_web, HelloWeb.Endpoint, 19 | http: [ip: {127, 0, 0, 1}, port: 4002], 20 | secret_key_base: "q08ePXcxqryzoEdRvR+EDJaFP3lrbYD5r7PxD9hSc9FZ6zopJToZDikKA7damS2A", 21 | server: false 22 | 23 | # Print only warnings and errors during test 24 | config :logger, level: :warn 25 | 26 | # In test we don't send emails. 27 | config :hello, Hello.Mailer, adapter: Swoosh.Adapters.Test 28 | 29 | # Initialize plugs at runtime for faster test compilation 30 | config :phoenix, :plug_init_mode, :runtime 31 | -------------------------------------------------------------------------------- /docker-compose.yml: -------------------------------------------------------------------------------- 1 | version: "3" 2 | services: 3 | postgres: 4 | image: postgres:14.1 5 | ports: 6 | - 5432:5432 7 | environment: 8 | POSTGRES_USER: postgres 9 | POSTGRES_PASSWORD: postgres 10 | POSTGRES_DB: hello_dev 11 | -------------------------------------------------------------------------------- /mix.exs: -------------------------------------------------------------------------------- 1 | defmodule Hello.Umbrella.MixProject do 2 | use Mix.Project 3 | 4 | def project do 5 | [ 6 | apps_path: "apps", 7 | version: "0.1.0", 8 | start_permanent: Mix.env() == :prod, 9 | deps: deps(), 10 | aliases: aliases(), 11 | releases: releases() 12 | ] 13 | end 14 | 15 | # Dependencies can be Hex packages: 16 | # 17 | # {:mydep, "~> 0.3.0"} 18 | # 19 | # Or git/path repositories: 20 | # 21 | # {:mydep, git: "https://github.com/elixir-lang/mydep.git", tag: "0.1.0"} 22 | # 23 | # Type "mix help deps" for more examples and options. 24 | # 25 | # Dependencies listed here are available only for this project 26 | # and cannot be accessed from applications inside the apps/ folder. 27 | defp deps do 28 | [] 29 | end 30 | 31 | # Aliases are shortcuts or tasks specific to the current project. 32 | # For example, to install project dependencies and perform other setup tasks, run: 33 | # 34 | # $ mix setup 35 | # 36 | # See the documentation for `Mix` for more info on aliases. 37 | # 38 | # Aliases listed here are available only for this project 39 | # and cannot be accessed from applications inside the apps/ folder. 40 | defp aliases do 41 | [ 42 | # run `mix setup` in all child apps 43 | setup: ["cmd mix setup"] 44 | ] 45 | end 46 | 47 | # Umbrella projects require releases to be explicitly defined with a non-empty applications key that chooses which umbrella children should be part of the releases 48 | defp releases do 49 | [ 50 | hello_umbrella: [ 51 | applications: [ 52 | hello: :permanent, 53 | hello_web: :permanent 54 | ] 55 | ] 56 | ] 57 | end 58 | end 59 | -------------------------------------------------------------------------------- /mix.lock: -------------------------------------------------------------------------------- 1 | %{ 2 | "castore": {:hex, :castore, "0.1.14", "3f6d7c7c1574c402fef29559d3f1a7389ba3524bc6a090a5e9e6abc3af65dcca", [:mix], [], "hexpm", "b34af542eadb727e6c8b37fdf73e18b2e02eb483a4ea0b52fd500bc23f052b7b"}, 3 | "connection": {:hex, :connection, "1.1.0", "ff2a49c4b75b6fb3e674bfc5536451607270aac754ffd1bdfe175abe4a6d7a68", [:mix], [], "hexpm", "722c1eb0a418fbe91ba7bd59a47e28008a189d47e37e0e7bb85585a016b2869c"}, 4 | "cowboy": {:hex, :cowboy, "2.9.0", "865dd8b6607e14cf03282e10e934023a1bd8be6f6bacf921a7e2a96d800cd452", [:make, :rebar3], [{:cowlib, "2.11.0", [hex: :cowlib, repo: "hexpm", optional: false]}, {:ranch, "1.8.0", [hex: :ranch, repo: "hexpm", optional: false]}], "hexpm", "2c729f934b4e1aa149aff882f57c6372c15399a20d54f65c8d67bef583021bde"}, 5 | "cowboy_telemetry": {:hex, :cowboy_telemetry, "0.4.0", "f239f68b588efa7707abce16a84d0d2acf3a0f50571f8bb7f56a15865aae820c", [:rebar3], [{:cowboy, "~> 2.7", [hex: :cowboy, repo: "hexpm", optional: false]}, {:telemetry, "~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "7d98bac1ee4565d31b62d59f8823dfd8356a169e7fcbb83831b8a5397404c9de"}, 6 | "cowlib": {:hex, :cowlib, "2.11.0", "0b9ff9c346629256c42ebe1eeb769a83c6cb771a6ee5960bd110ab0b9b872063", [:make, :rebar3], [], "hexpm", "2b3e9da0b21c4565751a6d4901c20d1b4cc25cbb7fd50d91d2ab6dd287bc86a9"}, 7 | "db_connection": {:hex, :db_connection, "2.4.1", "6411f6e23f1a8b68a82fa3a36366d4881f21f47fc79a9efb8c615e62050219da", [:mix], [{:connection, "~> 1.0", [hex: :connection, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "ea36d226ec5999781a9a8ad64e5d8c4454ecedc7a4d643e4832bf08efca01f00"}, 8 | "decimal": {:hex, :decimal, "2.0.0", "a78296e617b0f5dd4c6caf57c714431347912ffb1d0842e998e9792b5642d697", [:mix], [], "hexpm", "34666e9c55dea81013e77d9d87370fe6cb6291d1ef32f46a1600230b1d44f577"}, 9 | "ecto": {:hex, :ecto, "3.7.1", "a20598862351b29f80f285b21ec5297da1181c0442687f9b8329f0445d228892", [:mix], [{:decimal, "~> 1.6 or ~> 2.0", [hex: :decimal, repo: "hexpm", optional: false]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: true]}, {:telemetry, "~> 0.4 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "d36e5b39fc479e654cffd4dbe1865d9716e4a9b6311faff799b6f90ab81b8638"}, 10 | "ecto_sql": {:hex, :ecto_sql, "3.7.1", "8de624ef50b2a8540252d8c60506379fbbc2707be1606853df371cf53df5d053", [:mix], [{:db_connection, "~> 2.2", [hex: :db_connection, repo: "hexpm", optional: false]}, {:ecto, "~> 3.7.0", [hex: :ecto, repo: "hexpm", optional: false]}, {:myxql, "~> 0.4.0 or ~> 0.5.0", [hex: :myxql, repo: "hexpm", optional: true]}, {:postgrex, "~> 0.15.0 or ~> 1.0", [hex: :postgrex, repo: "hexpm", optional: true]}, {:tds, "~> 2.1.1 or ~> 2.2", [hex: :tds, repo: "hexpm", optional: true]}, {:telemetry, "~> 0.4.0 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "2b42a32e2ce92f64aba5c88617891ab3b0ba34f3f3a503fa20009eae1a401c81"}, 11 | "esbuild": {:hex, :esbuild, "0.4.0", "9f17db148aead4cf1e6e6a584214357287a93407b5fb51a031f122b61385d4c2", [:mix], [{:castore, ">= 0.0.0", [hex: :castore, repo: "hexpm", optional: false]}], "hexpm", "b61e4e6b92ffe45e4ee4755a22de6211a67c67987dc02afb35a425a0add1d447"}, 12 | "file_system": {:hex, :file_system, "0.2.10", "fb082005a9cd1711c05b5248710f8826b02d7d1784e7c3451f9c1231d4fc162d", [:mix], [], "hexpm", "41195edbfb562a593726eda3b3e8b103a309b733ad25f3d642ba49696bf715dc"}, 13 | "floki": {:hex, :floki, "0.32.0", "f915dc15258bc997d49be1f5ef7d3992f8834d6f5695270acad17b41f5bcc8e2", [:mix], [{:html_entities, "~> 0.5.0", [hex: :html_entities, repo: "hexpm", optional: false]}], "hexpm", "1c5a91cae1fd8931c26a4826b5e2372c284813904c8bacb468b5de39c7ececbd"}, 14 | "gettext": {:hex, :gettext, "0.18.2", "7df3ea191bb56c0309c00a783334b288d08a879f53a7014341284635850a6e55", [:mix], [], "hexpm", "f9f537b13d4fdd30f3039d33cb80144c3aa1f8d9698e47d7bcbcc8df93b1f5c5"}, 15 | "html_entities": {:hex, :html_entities, "0.5.2", "9e47e70598da7de2a9ff6af8758399251db6dbb7eebe2b013f2bbd2515895c3c", [:mix], [], "hexpm", "c53ba390403485615623b9531e97696f076ed415e8d8058b1dbaa28181f4fdcc"}, 16 | "jason": {:hex, :jason, "1.2.2", "ba43e3f2709fd1aa1dce90aaabfd039d000469c05c56f0b8e31978e03fa39052", [:mix], [{:decimal, "~> 1.0 or ~> 2.0", [hex: :decimal, repo: "hexpm", optional: true]}], "hexpm", "18a228f5f0058ee183f29f9eae0805c6e59d61c3b006760668d8d18ff0d12179"}, 17 | "mime": {:hex, :mime, "2.0.2", "0b9e1a4c840eafb68d820b0e2158ef5c49385d17fb36855ac6e7e087d4b1dcc5", [:mix], [], "hexpm", "e6a3f76b4c277739e36c2e21a2c640778ba4c3846189d5ab19f97f126df5f9b7"}, 18 | "phoenix": {:hex, :phoenix, "1.6.5", "07af307b28a5820b4394f27ac7003df052e065ff651520a58abb16be1eecd519", [:mix], [{:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: true]}, {:phoenix_pubsub, "~> 2.0", [hex: :phoenix_pubsub, repo: "hexpm", optional: false]}, {:phoenix_view, "~> 1.0", [hex: :phoenix_view, repo: "hexpm", optional: false]}, {:plug, "~> 1.10", [hex: :plug, repo: "hexpm", optional: false]}, {:plug_cowboy, "~> 2.2", [hex: :plug_cowboy, repo: "hexpm", optional: true]}, {:plug_crypto, "~> 1.2", [hex: :plug_crypto, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "97dc3052ca648499280e0636471f1d0439fc623ccdce27d2d8135651421ee80c"}, 19 | "phoenix_ecto": {:hex, :phoenix_ecto, "4.4.0", "0672ed4e4808b3fbed494dded89958e22fb882de47a97634c0b13e7b0b5f7720", [:mix], [{:ecto, "~> 3.3", [hex: :ecto, repo: "hexpm", optional: false]}, {:phoenix_html, "~> 2.14.2 or ~> 3.0", [hex: :phoenix_html, repo: "hexpm", optional: true]}, {:plug, "~> 1.9", [hex: :plug, repo: "hexpm", optional: false]}], "hexpm", "09864e558ed31ee00bd48fcc1d4fc58ae9678c9e81649075431e69dbabb43cc1"}, 20 | "phoenix_html": {:hex, :phoenix_html, "3.1.0", "0b499df05aad27160d697a9362f0e89fa0e24d3c7a9065c2bd9d38b4d1416c09", [:mix], [{:plug, "~> 1.5", [hex: :plug, repo: "hexpm", optional: true]}], "hexpm", "0c0a98a2cefa63433657983a2a594c7dee5927e4391e0f1bfd3a151d1def33fc"}, 21 | "phoenix_live_dashboard": {:hex, :phoenix_live_dashboard, "0.6.2", "0769470265eb13af01b5001b29cb935f4710d6adaa1ffc18417a570a337a2f0f", [:mix], [{:ecto, "~> 3.6.2 or ~> 3.7", [hex: :ecto, repo: "hexpm", optional: true]}, {:ecto_mysql_extras, "~> 0.3", [hex: :ecto_mysql_extras, repo: "hexpm", optional: true]}, {:ecto_psql_extras, "~> 0.7", [hex: :ecto_psql_extras, repo: "hexpm", optional: true]}, {:mime, "~> 1.6 or ~> 2.0", [hex: :mime, repo: "hexpm", optional: false]}, {:phoenix_live_view, "~> 0.17.1", [hex: :phoenix_live_view, repo: "hexpm", optional: false]}, {:telemetry_metrics, "~> 0.6.0", [hex: :telemetry_metrics, repo: "hexpm", optional: false]}], "hexpm", "5bc6c6b38a2ca8b5020b442322fcee6afd5e641637a0b1fb059d4bd89bc58e7b"}, 22 | "phoenix_live_reload": {:hex, :phoenix_live_reload, "1.3.3", "3a53772a6118d5679bf50fc1670505a290e32a1d195df9e069d8c53ab040c054", [:mix], [{:file_system, "~> 0.2.1 or ~> 0.3", [hex: :file_system, repo: "hexpm", optional: false]}, {:phoenix, "~> 1.4", [hex: :phoenix, repo: "hexpm", optional: false]}], "hexpm", "766796676e5f558dbae5d1bdb066849673e956005e3730dfd5affd7a6da4abac"}, 23 | "phoenix_live_view": {:hex, :phoenix_live_view, "0.17.5", "63f52a6f9f6983f04e424586ff897c016ecc5e4f8d1e2c22c2887af1c57215d8", [:mix], [{:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: true]}, {:phoenix, "~> 1.5.9 or ~> 1.6.0", [hex: :phoenix, repo: "hexpm", optional: false]}, {:phoenix_html, "~> 3.1", [hex: :phoenix_html, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4.2 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "c5586e6a3d4df71b8214c769d4f5eb8ece2b4001711a7ca0f97323c36958b0e3"}, 24 | "phoenix_pubsub": {:hex, :phoenix_pubsub, "2.0.0", "a1ae76717bb168cdeb10ec9d92d1480fec99e3080f011402c0a2d68d47395ffb", [:mix], [], "hexpm", "c52d948c4f261577b9c6fa804be91884b381a7f8f18450c5045975435350f771"}, 25 | "phoenix_view": {:hex, :phoenix_view, "1.0.0", "fea71ecaaed71178b26dd65c401607de5ec22e2e9ef141389c721b3f3d4d8011", [:mix], [{:phoenix_html, "~> 2.14.2 or ~> 3.0", [hex: :phoenix_html, repo: "hexpm", optional: true]}], "hexpm", "82be3e2516f5633220246e2e58181282c71640dab7afc04f70ad94253025db0c"}, 26 | "plug": {:hex, :plug, "1.12.1", "645678c800601d8d9f27ad1aebba1fdb9ce5b2623ddb961a074da0b96c35187d", [:mix], [{:mime, "~> 1.0 or ~> 2.0", [hex: :mime, repo: "hexpm", optional: false]}, {:plug_crypto, "~> 1.1.1 or ~> 1.2", [hex: :plug_crypto, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4.3 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "d57e799a777bc20494b784966dc5fbda91eb4a09f571f76545b72a634ce0d30b"}, 27 | "plug_cowboy": {:hex, :plug_cowboy, "2.5.2", "62894ccd601cf9597e2c23911ff12798a8a18d237e9739f58a6b04e4988899fe", [:mix], [{:cowboy, "~> 2.7", [hex: :cowboy, repo: "hexpm", optional: false]}, {:cowboy_telemetry, "~> 0.3", [hex: :cowboy_telemetry, repo: "hexpm", optional: false]}, {:plug, "~> 1.7", [hex: :plug, repo: "hexpm", optional: false]}], "hexpm", "ea6e87f774c8608d60c8d34022a7d073bd7680a0a013f049fc62bf35efea1044"}, 28 | "plug_crypto": {:hex, :plug_crypto, "1.2.2", "05654514ac717ff3a1843204b424477d9e60c143406aa94daf2274fdd280794d", [:mix], [], "hexpm", "87631c7ad914a5a445f0a3809f99b079113ae4ed4b867348dd9eec288cecb6db"}, 29 | "postgrex": {:hex, :postgrex, "0.15.13", "7794e697481799aee8982688c261901de493eb64451feee6ea58207d7266d54a", [:mix], [{:connection, "~> 1.0", [hex: :connection, repo: "hexpm", optional: false]}, {:db_connection, "~> 2.1", [hex: :db_connection, repo: "hexpm", optional: false]}, {:decimal, "~> 1.5 or ~> 2.0", [hex: :decimal, repo: "hexpm", optional: false]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: true]}], "hexpm", "3ffb76e1a97cfefe5c6a95632a27ffb67f28871c9741fb585f9d1c3cd2af70f1"}, 30 | "ranch": {:hex, :ranch, "1.8.0", "8c7a100a139fd57f17327b6413e4167ac559fbc04ca7448e9be9057311597a1d", [:make, :rebar3], [], "hexpm", "49fbcfd3682fab1f5d109351b61257676da1a2fdbe295904176d5e521a2ddfe5"}, 31 | "swoosh": {:hex, :swoosh, "1.5.2", "c246e0038367bf9ac3b66715151930a7215eb7427c242cc5206fc59fa344a7dc", [:mix], [{:cowboy, "~> 1.1 or ~> 2.4", [hex: :cowboy, repo: "hexpm", optional: true]}, {:finch, "~> 0.6", [hex: :finch, repo: "hexpm", optional: true]}, {:gen_smtp, "~> 0.13 or ~> 1.0", [hex: :gen_smtp, repo: "hexpm", optional: true]}, {:hackney, "~> 1.9", [hex: :hackney, repo: "hexpm", optional: true]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: false]}, {:mail, "~> 0.2", [hex: :mail, repo: "hexpm", optional: true]}, {:mime, "~> 1.1 or ~> 2.0", [hex: :mime, repo: "hexpm", optional: false]}, {:plug_cowboy, ">= 1.0.0", [hex: :plug_cowboy, repo: "hexpm", optional: true]}, {:telemetry, "~> 0.4.2 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "fc34b2c14afaa6e2cd92c829492536887a00ae625e404e40469926949b029605"}, 32 | "telemetry": {:hex, :telemetry, "1.0.0", "0f453a102cdf13d506b7c0ab158324c337c41f1cc7548f0bc0e130bbf0ae9452", [:rebar3], [], "hexpm", "73bc09fa59b4a0284efb4624335583c528e07ec9ae76aca96ea0673850aec57a"}, 33 | "telemetry_metrics": {:hex, :telemetry_metrics, "0.6.1", "315d9163a1d4660aedc3fee73f33f1d355dcc76c5c3ab3d59e76e3edf80eef1f", [:mix], [{:telemetry, "~> 0.4 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "7be9e0871c41732c233be71e4be11b96e56177bf15dde64a8ac9ce72ac9834c6"}, 34 | "telemetry_poller": {:hex, :telemetry_poller, "1.0.0", "db91bb424e07f2bb6e73926fcafbfcbcb295f0193e0a00e825e589a0a47e8453", [:rebar3], [{:telemetry, "~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "b3a24eafd66c3f42da30fc3ca7dda1e9d546c12250a2d60d7b81d264fbec4f6e"}, 35 | } 36 | --------------------------------------------------------------------------------