I tried to make a Chat to Heroku using the Phoenix

sing-up! https://chat.syui.cf, @syui@syui.cf

status : https://cachet.mybluemix.net


This before, because I heard a story that you want make chat (chat), I tried to stand towards the heroku in about an hour or two. Little was or examined.

$ git clone https://github.com/dwyl/phoenix-chat-example

$ cd !$:t

$ heroku create $APP_NAME

$ rm -rf .git

$ heroku git:remote -a $APP_NAME

$ echo "erlang_version=20.1
>> elixir_buildpack.config

$ echo "web: MIX_ENV=prod POOL_SIZE=2 mix ecto.migrate && mix phx.server" >> Procfile

$ vim config/prod.exs
config :chat, ChatWeb.Endpoint,
load_from_system_env: true,
url: [scheme: "https", host: "syui-chat.herokuapp.com", port: 443],
force_ssl: [rewrite_on: [:x_forwarded_proto]],
cache_static_manifest: "priv/static/cache_manifest.json",
secret_key_base: Map.fetch!(System.get_env(), "SECRET_KEY_BASE")

$ mix deps.get $ mix phx.gen.secret
XXX $ heroku config:set SECRET_KEY_BASE="XXX" -a $APP_NAME $ heroku addons:create heroku-postgresql:hobby-dev -a $APP_NAME $ heroku buildpacks:set https://github.com/HashNuke/heroku-buildpack-elixir.git -a $APP_NAME $ heroku buildpacks:add --index 2 https://github.com/gjaldon/heroku-buildpack-phoenix-static.git -a $APP_NAME

$ echo mix.lock >> .gitignore $ git add . $ git commit -m "first" $ git push heroku master





This time, give them the login function, I tried to or implement the mail notification as notify.

I tried to built the heroku I think even a little function generous of chat.

This is, tony612/exchat use, but with the login function. It has become the only example ish src. (Maybe, it stands for example-chat, the slack reference)

icon of the acquisition is I do not you're using gravatar.com from mail (do not know). It is a story that read code.

Well, in the living Machaut from the clone of the repo. Guy is feeling also like a example-chat this time.

$ git clone https://github.com/tony612/exchat

$ cd !$:t

$ cat ./elixir_buildpack.config erlang_version=20.1 elixir_version=1.6.0 always_rebuild=true config_vars_to_export=(DATABASE_URL JWT_SECRET)

$ cat ./Procfile
web: MIX_ENV=prod POOL_SIZE=2 mix ecto.migrate && mix phoenix.server

$ heroku buildpacks:set https://github.com/HashNuke/heroku-buildpack-elixir.git -a $APP_NAME # npm i $ heroku buildpacks:add --index 2 https://github.com/gjaldon/heroku-buildpack-phoenix-static.git -a $APP_NAME

I feel seen, the front-end, react, redux, you're using the bootstrap, is the impression you are firm and split.

heroku config: The Set, DATABASE_URL, JWT_SECRET, SECRET_KEY_BASEplease put. To say that, DATABASE_URL, PORT because I think that is arbitrarily generated If you put a postgres, it is JWT and KEY. Value, $ mix phx.gen.sercetwill be the result.

$ mix phx.gen.sercet

123 $ heroku config:set JWT_SECRET=123 -a $APP_NAME $ heroku config:set SECRET_KEY_BASE=123 -a $APP_NAME


It means of notification I have a variety, because the mail is simple enough, first from as simple likely.

applications: [:bamboo]

defp deps do
[{:phoenix, "~> 1.3.3"},
{:bamboo, "~> 1.0.0"},
{:bamboo_smtp, "~> 1.5.0"}

 config :exchat, Exchat.Mailer,

adapter: Bamboo.SMTPAdapter,
server: "smtp.gmail.com",
port: 587,
username: System.get_env("GMAIL"),
password: System.get_env("GMAIL_APP_PASS"),
tls: :if_available, # can be `:always` or `:never`
ssl: false, # can be `true`
retries: 1

In this regard, But usually that you have to use the Toka mailgun, in the demo, so gmail.

defmodule Exchat.Mailer do

use Bamboo.Mailer, otp_app: :exchat end

defmodule Exchat.Email do

use Bamboo.Phoenix, view: Exchat.EmailView

def hello_email(email) do
|> to(email)
|> from("support@xxx.herokuapp.com")
|> subject("login")
|> text_body(".")
end end

user is to send a mail Once you login. Since this by, administrators get an outgoing e-mail, how do I notice it.


def login_by_email_pass(conn, email, pass, opts) do
repo = Keyword.fetch!(opts, :repo)
user = repo.get_by(User, email: email)

cond do
user && checkpw(pass, user.password_hash) ->
Exchat.Email.hello_email(user.email) |> Exchat.Mailer.deliver_now
{:ok, login(conn, user)}
user ->
{:error, :unauthorized, conn}
true ->
{:error, :not_found, conn}

In fact, try to check the mail try to login. If it was confirmed, change the code.

When the DM and the message came also and go do it like this if you want to notify looks good.

E-mail notification or rather is variously painful. Because usually think not to do, ravenx Would you say that the use Toka/slack.


Prima facie, mailgun leave me also how to write.

mailgun: As a side note of in order to use, in the case of free, you can not only send from api/v3 of mail in the sandbox. Moreover, not send only authenticated mail address, therefore, rewrite the lib/mail.ex, to: verify-email, from: sandbox.domain, text_body: you must ensure that the email. That is, keep in mind that it does not Ninae only role to notify the administrator when someone instead of sent to the login user (notification) is login. But if it is not a free is okay because you can send normally from api.

# In config/config.exs, or config.prod.exs, etc.
 config :my_app, MyApp.Mailer,

adapter: Bamboo.MailgunAdapter,
api_key: "my_api_key",
domain: "your.domain"

The value of new_email for using the mailgun (MailgunAdapter) is referring to here.

$ curl -s --user 'api:YOUR_API_KEY' \

https://api.mailgun.net/v3/YOUR_DOMAIN_NAME/messages \
-F from='Excited User <mailgun@YOUR_DOMAIN_NAME>' \
-F to=bar@example.com \
-F subject='Hello' \
-F text='Testing some Mailgun awesomeness!'


Now, will the contents of the frontend of exchat.

In heorku, usually,/app, will deploy is divided into/web.

So, the success or failure of the frontend, such as the success or failure and react of backend such as phx has basically become separately.

In other words, it deploys the phx succeeded normally, webpack fails, you impossible also crap can not be displayed well is/web.

exchat constitutes the backend in the elixir (phoenix), frontend is, seems to constitute react, redux, or the like.

Here, preview of frontend (js), build, such as the convert, seems to use webpack, babel and the like.

those that have been build is, ./priv/static/app.jsit seems to be placed in. However, because it is written in .gitignore, do not push.

$ cat webpack.config.js

$ mix deps.get

$ npm i

$ webpack

$ cat ./priv/static/app.js

$ mix phx.server

To change the layout, ./web/templates/layoutcolor html:headyou can fiddle with the above, but basically, ./client/you touch the following. These are build using the webpack.

./config/dev.exsBy looking at, you can see how the preview.

When I was touching the riot, but I feel that you have been using happens to be webpack, I have forgotten already.

It should be noted, cloudflare, if you are using Toka heroku, because it worked and cache, because app.js like a one place to the stuffed file such as those generated this time, in particular, may not be easily reflected. This is, Toka to the purge, or is not it better to Toka be confirmed by herokuapp.com, but still some time-consuming it is often time to reflect. The same is also using the browser of the private window. frontend is around here, it is very. But is the first look impression only.

$ heroku plugins:install heroku-repo
 $ heroku repo:purge_cache

preview is, $ bash ./compileafter you, $ mix phx.serveryou.-> localhost:4000

A variety of packages we tried to update.

For more information click here please read the article.