From 6231fab5ba6f64ea30d8ee3d02a0282ead027f75 Mon Sep 17 00:00:00 2001 From: nelsonic Date: Sun, 13 Mar 2022 13:59:18 +0000 Subject: [PATCH] add more detail to README.md and links in tutorial.md #53 --- README.md | 62 ++++++++++++++++++++++++++++-------- lib/app_web/live/app_live.ex | 11 +++++++ tutorial.md | 44 +++++++++++++++++-------- 3 files changed, 90 insertions(+), 27 deletions(-) create mode 100644 lib/app_web/live/app_live.ex diff --git a/README.md b/README.md index 8b06ccf..166dec3 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,23 @@ -# sleep +
+ +# sleep 💤 + +![sleep-hero-image](https://user-images.githubusercontent.com/194400/159523182-0db2588a-658d-45ae-8ce3-98c37a47ca72.jpeg) + + +### “_Sleep is the single most effective thing we can do to reset our brain and body health each day._”
~ Matthew Walker, Why We Sleep: Unlocking the Power of Sleep and Dreams + +
+ +[![GitHub Workflow Status](https://img.shields.io/github/workflow/status/dwyl/sleep/Elixir%20CI?label=build&style=flat-square)](https://github.com/dwyl/phoenix-liveview-chat-example/actions/workflows/cy.yml) +[![codecov test coverage](https://img.shields.io/codecov/c/github/dwyl/sleep/main.svg?style=flat-square)](https://codecov.io/github/dwyl/phoenix-liveview-chat-example?branch=main) +[![HitCount](http://hits.dwyl.com/dwyl/sleep.svg?style=flat-square&show=unique)](http://hits.dwyl.com/dwyl/sleep) + +**Try it**: [**sleepdev.herokuapp.com**](https://sleepdev.herokuapp.com/) +![wake-sleeping-heroku-app](https://liveview-chat-example.herokuapp.com/ping) +
+ +
Sleep is the single most important activity in life; it restores our tired bodies @@ -11,17 +30,19 @@ and reflecting on your sleep quality can help you focus on this vital aspect of health and longevity. +
-# Why? +# Why? 🤷‍♀️ If you don't get a good night's sleep virtually everything about your next day will be worse. -See below for all the areas sleep affects. +> See below for all the areas sleep affects. +
-# What? +# What? 📱 🛌 This App is the simplest possible sleep tracker (_other than using a paper notepad and pen @@ -34,33 +55,42 @@ but leaves a lot enhancements out. If you think of a feature/improvement, _please_ [**open an issue**!](https://github.com/dwyl/sleep/issues) -Contributions/ideas are always welcome +**Contributions/ideas** are **_always_ welcome** and we're delighted to extend this in response to feedback! -# Who? +
+ +# Who? 👤 -Everyone sleeps. +_Everyone_ that sleeps. +
-# When? +# When? 🕗 -You can start using this MVP _now_ (_tonight_). +You can start using the MVP _now_ (_tonight_)! > If you're reading this past **22:00**, go straight to the "***Try it!***" section and treat yourself to an _early_ night! +Bookmark (⭐) the project +and come back to it tomorrow +
+It's never too late +to start focusing on your sleep quality. # How? -## Try it! +## _Try_ it! -Firstly, you can try the App via Heroku: +Firstly, if you haven't already, +you can _try_ the App via Heroku: https://sleepdev.herokuapp.com Try the following actions: @@ -73,7 +103,7 @@ Try the following actions: + ***Confirm*** your "sleep" session was recorded. -## Run it! +## _Run_ it! Now that you've tried it on Heroku, if you want to dig deeper, @@ -100,19 +130,23 @@ Install the dependencies: mix deps.get ``` +_Run_ the app: +``` +mix phx.server +``` - [![HitCount](http://hits.dwyl.com/dwyl/sleep.svg?style=flat-square)](http://hits.dwyl.com/dwyl/sleep) - # Research We have read several books on sleep (_so you don't have to_). +### “_Before you sleep, read something that is exquisite, and worth remembering._” ~
Desiderius Erasmus + ## Why Focus on Sleep? If you aren't sleeping enough diff --git a/lib/app_web/live/app_live.ex b/lib/app_web/live/app_live.ex new file mode 100644 index 0000000..c85df71 --- /dev/null +++ b/lib/app_web/live/app_live.ex @@ -0,0 +1,11 @@ +defmodule App.AppLive do + use AppWeb, :live_view + + def mount(_params, _session, socket) do + {:ok, socket} + end + + def render(assigns) do + AppWeb.AppView.render("messages.html", assigns) + end +end \ No newline at end of file diff --git a/tutorial.md b/tutorial.md index 2554632..57fdd1a 100644 --- a/tutorial.md +++ b/tutorial.md @@ -1,7 +1,8 @@ # _Tutorial_ -This tutorial takes you through _building_ a sleep tracking App from scratch -so that you can understand how it works. +This tutorial takes you through _building_ +a sleep tracking App from scratch +so that you can _understand_ how it works. If you get stuck, _please_ [**ask questions**!](https://github.com/dwyl/sleep/issues) @@ -9,9 +10,10 @@ If you get stuck, _please_ ## Implementation Note We built this MVP App using using -[**`Elixir`**](https://github.com/dwyl/learn-elixir) -and +[**`Elixir`**](https://github.com/dwyl/learn-elixir), [**`Phoenix`**](https://github.com/dwyl/learn-phoenix-framework) +and +[**`LiveView`**](https://github.com/dwyl/phoenix-liveview-counter-tutorial) because it's one of the simplest ways to build web applications from first principals. @@ -37,16 +39,17 @@ might get you different results ... https://twitter.com/iamdevloper/status/787969734918668289 --> -## Create New Phoenix App +## 1. Create a New Phoenix App ```sh -mix phx.new app --no-mailer --no-dashboard +mix phx.new app --live --no-mailer --no-dashboard ``` This creates a new Phoenix Web App named **`app`** -without the mailer (email) or live dashboard -but with a database and `LiveView` support. - +with everything setup for `LiveView` support +but without the mailer (email) or live dashboard +cause we won't be needing either of those features +and we don't want unused/untested code. When you see the prompt asking you to fetch and install the dependencies: @@ -117,7 +120,7 @@ defmodule ChatWeb.Router do ``` Having `Chat` or `ChatWeb` namespace can be useful -if you're working on multiple Phoenix apps simultaneously +if you're working on multiple Phoenix apps _simultaneously_ and need to context switch. That's why we use the `Auth` namespace in our Authentication App: @@ -133,7 +136,10 @@ defmodule AuthWeb.AuthController do The reasons why _this_ app is namespaced **`App`** are:
**a)** It's less to type and still provides clarity/context.
-**b)**
+**b)** The word "sleep" has a special significance in Erlang/Elixir +see: [`sleep/1`](https://www.erlang.org/doc/man/timer.html#sleep-1) +so we don't want our IDE constantly suggesting that we +suspend the process ...
**c)** If we _succeed_ in building a sleep-tracking app, we will re-use some of the code in our "main" App. [github.com/dwyl/app](https://github.com/dwyl/app) @@ -142,7 +148,9 @@ This means it's easy to without needing to waste time with "find & replace".
-If you prefer to namespace your app differently, go for it!s +If you prefer to namespace your app differently, go for it! + +
## Show Me the Code! 👩‍💻 @@ -155,14 +163,18 @@ we need to create a new `live` directory with the following path: `lib/app_web/live` +e.g: `mkdir lib/app_web/live` + ### Create `app_live.ex` File Inside that newly created `/live` directory, create a new file called `app_live.ex` -with the path: +so the file path is: `lib/app_web/live/app_live.ex` +_Type_ the following code in the file: + ```elixir defmodule App.AppLive do use AppWeb, :live_view @@ -178,8 +190,14 @@ end ``` + ### Update `router.ex` + and navigate to the `lib/app_web/router.ex` file. + + + +[![HitCount](http://hits.dwyl.com/dwyl/sleep-tutorial.svg?style=flat-square)](http://hits.dwyl.com/dwyl/sleep) \ No newline at end of file