Phoenix v1.6.2 update

Updated to Phoenix 1.6.2; going to push changes to my repo then follow the README guide to see if I can replicate the error mentioned in issue #48 on the main repo so I can address it

Author: ajmeese7

.gitattributes

@@ -0,0 +1,3 @@
+* text=auto eol=lf
+*.{cmd,[cC][mM][dD]} text eol=crlf
+*.{bat,[bB][aA][tT]} text eol=crlf

.github/workflows/ci.yml

@@ -0,0 +1,35 @@
+name: Elixir CI
+
+on:
+  push:
+    branches: [ main ]
+  pull_request:
+    branches: [ main ]
+
+jobs:
+  build:
+    name: Build and test
+    runs-on: ubuntu-latest
+    steps:
+    - uses: actions/checkout@v2
+    - name: Set up Elixir
+      uses: erlef/[email protected]
+      with:
+        elixir-version: '1.12.3' # Define the elixir version [required]
+        otp-version: '24.0.2' # Define the OTP version [required]
+    - name: Restore dependencies cache
+      uses: actions/cache@v2
+      with:
+        path: deps
+        key: ${{ runner.os }}-mix-${{ hashFiles('**/mix.lock') }}
+        restore-keys: ${{ runner.os }}-mix-
+    - name: Install dependencies
+      run: mix deps.get
+    - name: Run Tests
+      run: mix coveralls.json
+      env:
+        GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        MIX_ENV: test
+        # AUTH_API_KEY: 2PzB7PPnpuLsbWmWtXpGyI+kfSQSQ1zUW2Atz/+8PdZuSEJzHgzGnJWV35nTKRwx
+    - name: Upload coverage to Codecov
+      uses: codecov/codecov-action@v1

.gitignore

@@ -20,7 +20,8 @@ npm-debug.log
 # The directory NPM downloads your dependencies sources to.
 /assets/node_modules/
 
-# Since we are building assets from assets/,
-# we ignore priv/static. You may want to comment
-# this depending on your deployment strategy.
-/priv/static/
+# Ignore assets that are produced by build tools.
+/priv/static/assets/
+
+# Ignore digested assets cache.
+/priv/static/cache_manifest.json

.travis.yml

@@ -2,7 +2,7 @@
 
 # Phoenix LiveView Counter Tutorial
 
-[![Build Status](https://img.shields.io/travis/dwyl/phoenix-liveview-counter-tutorial/master.svg?style=flat-square)](https://travis-ci.org/dwyl/phoenix-liveview-counter-tutorial)
+![GitHub Workflow Status](https://img.shields.io/github/workflow/status/dwyl/phoenix-liveview-counter-tutorial/Elixir%20CI?label=build&style=flat-square)
 [![codecov.io](https://img.shields.io/codecov/c/github/dwyl/phoenix-liveview-counter-tutorial/master.svg?style=flat-square)](http://codecov.io/github/dwyl/phoenix-liveview-counter-tutorial?branch=master)
 [![Hex pm](http://img.shields.io/hexpm/v/phoenix_live_view.svg?style=flat-square)](https://hex.pm/packages/phoenix_live_view)
 [![contributions welcome](https://img.shields.io/badge/contributions-welcome-brightgreen.svg?style=flat-square)](https://github.com/dwyl/phoenix-liveview-counter-tutorial/issues)
@@ -98,10 +98,10 @@ elixir -v
 You should expect to see output similar to the following:
 
 ```elixir
-Elixir 1.10.4 (compiled with Erlang/OTP 23)
+Elixir 1.12.3 (compiled with Erlang/OTP 24)
 ```
 
-This informs us we are using `Elixir version 1.10.4`
+This informs us we are using `Elixir version 1.12.3`
 which is the _latest_ version at the time of writing.
 
 <br />
@@ -118,7 +118,7 @@ mix phx.new -v
 You should see:
 
 ```sh
-Phoenix v1.5.5
+Phoenix v1.6.2
 ```
 
 If you have an earlier version,
@@ -131,26 +131,6 @@ We are here to help!
 
 <br />
 
-**c.** **`Node.js` installed** on your computer.
-Download it from: https://nodejs.org
-
-If you run the following command in your terminal:
-
-```sh
-node -v
-```
-
-You should see output similar to:
-
-```
-v12.18.4
-```
-
-> Phoenix LiveView does not require the _latest_ Node.js,
-> so if you have a _recent_ version e.g `v10`, you will be fine.
-
-<br />
-
 **d.** Familiarity with **basic `Elixir` syntax** is recommended
 but not essential; <br />
 you can pick it up as you go and
@@ -1262,47 +1242,6 @@ many are running.
 
 <br /><br /><br />
 
-## Notes and help
-
-### Problems with dependencies
-
-If the app hangs and throws this error:
-
-```
-[error] an exception was raised:
-    ** (FunctionClauseError) no function clause matching in Phoenix.LiveView.Channel.start_link/1
-        (phoenix_live_view 0.12.1) lib/phoenix_live_view/channel.ex:12: Phoenix.LiveView.Channel.start_link({LivetestWeb.Endpoint, {#PID<0.643.0>, #Reference<0.4273921409.1426587651.156349>}})
-
-```
-
-Modifying your mix.deps from:
-
-```elixir
- defp deps do
-    [
-      {:phoenix, "~> 1.5.1"},
-      {:phoenix_live_view, "~> 0.12.1"},
-      ...
-    ]
-  end
-```
-
-to this:
-
-```elixir
- defp deps do
-    [
-      {:phoenix, "~> 1.5.3"},
-      {:phoenix_live_view, "~> 0.13.0"},
-      ...
-    ]
-  end
-```
-
-Should fix the problem.
-
----
-
 ## Credits & Thanks! 🙌
 
 Credit for inspiring this tutorial goes to Dennis Beatty

README.md

@@ -1,6 +1,14 @@
 /* This file is for your main application css. */
 @import "./phoenix.css";
-@import "../node_modules/nprogress/nprogress.css";
+
+#livecount_container {
+  display: table;
+  margin: auto;
+}
+
+button {
+  margin: 2px
+}
 
 /* LiveView specific classes for your customizations */
 .invalid-feedback {

assets/.babelrc

@@ -1,7 +1,8 @@
 // We need to import the CSS so that webpack will load it.
 // The MiniCssExtractPlugin is used to separate it out into
 // its own CSS file.
-import "../css/app.scss"
+import "../css/phoenix.css"
+import "../css/app.css"
 
 // webpack automatically bundles all modules in your
 // entry points. Those entry points can be configured
@@ -14,16 +15,11 @@ import "../css/app.scss"
 //
 import "phoenix_html"
 import {Socket} from "phoenix"
-import NProgress from "nprogress"
 import {LiveSocket} from "phoenix_live_view"
 
 let csrfToken = document.querySelector("meta[name='csrf-token']").getAttribute("content")
 let liveSocket = new LiveSocket("/live", Socket, {params: {_csrf_token: csrfToken}})
 
-// Show progress bar on live navigation and form submits
-window.addEventListener("phx:page-loading-start", info => NProgress.start())
-window.addEventListener("phx:page-loading-stop", info => NProgress.done())
-
 // connect if there are any LiveViews on the page
 liveSocket.connect()