From f30f35c1af3266dd71c639c049dc6fb6453ab405 Mon Sep 17 00:00:00 2001 From: nelsonic Date: Sat, 23 Sep 2023 06:52:17 +0100 Subject: [PATCH] attempt to center header image for fields guide --- src/fields/02-schema.md | 67 +++++++++++++++++++++++++++++++++++++++++ src/fields/README.md | 9 ++++-- 2 files changed, 74 insertions(+), 2 deletions(-) diff --git a/src/fields/02-schema.md b/src/fields/02-schema.md index e69de29..2484e79 100644 --- a/src/fields/02-schema.md +++ b/src/fields/02-schema.md @@ -0,0 +1,67 @@ +# Create `attendee` schema + +The goal is to allow `people` attending **_Awesome_ Conf** +to submit the following data: + ++ `first_name` - how we greet you. Will appear on your conference pass. ++ `last_name` - your family name. Will appear on you conference pass. ++ `email` - to confirm attendance ++ `phone_number` - to verify your access when attending the secret event. ++ `address_line_1` - so we can send the welcome pack and prizes ++ `address_line_2` - if your address has multiple lines. ++ `postcode` - for the address. ++ `gender` - for venue capacity planning. ++ `diet_pref` - dietary preferences for meals and snacks provided at the conference. ++ `website` - share your awesomeness and have it as a QR code on your conference pass. ++ `desc` - brief description of your awesome project. ++ `feedback` - Feedback or suggestions + + +## 4.1 `gen.live` + +Using the +[`mix phx.gen.live`](https://hexdocs.pm/phoenix/Mix.Tasks.Phx.Gen.Schema.html) +command, +run: +```sh +mix phx.gen.live Accounts Attendee attendees first_name:string last_name:string email:string phone_number:string address_line_1:string address_line_2 postcode:string gender:string diet_pref:string website:string desc:string feedback:string +``` + +You should expect to see output similar to the following: + +```sh +* creating lib/fields_demo_web/live/attendee_live/show.ex +* creating lib/fields_demo_web/live/attendee_live/index.ex +* creating lib/fields_demo_web/live/attendee_live/form_component.ex +* creating lib/fields_demo_web/live/attendee_live/index.html.heex +* creating lib/fields_demo_web/live/attendee_live/show.html.heex +* creating test/fields_demo_web/live/attendee_live_test.exs +* creating lib/fields_demo/accounts/attendee.ex +* creating priv/repo/migrations/20230928032757_create_attendees.exs +* creating lib/fields_demo/accounts.ex +* injecting lib/fields_demo/accounts.ex +* creating test/fields_demo/accounts_test.exs +* injecting test/fields_demo/accounts_test.exs +* creating test/support/fixtures/accounts_fixtures.ex +* injecting test/support/fixtures/accounts_fixtures.ex + +Add the live routes to your browser scope in lib/fields_demo_web/router.ex: + + live "/attendees", AttendeeLive.Index, :index + live "/attendees/new", AttendeeLive.Index, :new + live "/attendees/:id/edit", AttendeeLive.Index, :edit + + live "/attendees/:id", AttendeeLive.Show, :show + live "/attendees/:id/show/edit", AttendeeLive.Show, :edit + + +Remember to update your repository by running migrations: + + $ mix ecto.migrate +``` + +Those are a _lot_ of new files. 😬 +Let's take a moment to go through them +and understand what each file is doing. + +### `lib/fields_demo_web/live/attendee_live/show.ex` diff --git a/src/fields/README.md b/src/fields/README.md index fdcf6dc..82414e3 100644 --- a/src/fields/README.md +++ b/src/fields/README.md @@ -1,3 +1,5 @@ +
+ # `Fields` Guide A **complete beginner's guide** @@ -5,6 +7,10 @@ to building a **`Phoenix` Web App** using **`fields`** to **_appropriately_ store personal data**. +![awesome-header-image](https://github.com/dwyl/fields-demo/assets/194400/a87a35ab-409d-4204-8b9f-8d4725b505f0) + +
+ # TODO: insert screenshot of working `fields-demo` app. ## Why? @@ -25,8 +31,7 @@ don't skip this chapter. The `fields-demo` App showcases a **registration form** -for a (ficticious) conference -"Awesome Conf". +for a (fictitious) conference called "**_Awesome_ Conf**". It shows you all the steps necessary to build the form using the `fields` package