Merge branch 'main' into podcast

Author: BrooklinJazz

.gitignore

@@ -1,6 +1,9 @@
 # The directory Mix will write compiled artifacts to.
 /_build/
 
+# Elixir LS
+.elixir_ls
+
 # If you run "mix test --cover", coverage assets end up here.
 /cover/
 

assets/tailwind.config.js

@@ -23,10 +23,16 @@ module.exports = {
             "background-position": "right center",
           },
         },
+        keyframes: {
+          wiggle: {
+            '0%, 100%': { transform: 'rotate(-3deg)' },
+            '50%': { transform: 'rotate(3deg)' },
+          }
+        },
         "fade-in": {
           "0%": {
             opacity: "0",
-            transform: "scale(1.2)",
+            transform: "scale(1.1)",
           },
           "100%": {
             opacity: "1",
@@ -35,9 +41,10 @@ module.exports = {
         },
       },
       animation: {
-        'spin-slow': 'spin 100s linear infinite',
+        'spin-slow': 'spin 60s linear infinite',
         "gradient-x": "gradient-x 9s ease infinite",
-        "fade-in": "fade-in ease 1s",
+        "fade-in": "fade-in ease-in 0.5s",
+        "wiggle": "wiggle 0.5s",
       },
     },
   },

lib/elixir_newbie/academy_content.ex

@@ -0,0 +1,12 @@
+defmodule ElixirNewbie.AcademyContent do
+  alias ElixirNewbie.AcademyContent.Lesson
+
+  use NimblePublisher,
+    build: Lesson,
+    from: Application.app_dir(:elixir_newbie, "priv/academy_content/*.md"),
+    as: :lessons,
+    highlighters: [:makeup_elixir]
+
+  # And finally export them
+  def all_lessons, do: @lessons
+end

lib/elixir_newbie/blog/post.ex lib/elixir_newbie/academy_content/lesson.ex

@@ -1,4 +1,4 @@
-defmodule ElixirNewbie.Blog.Post do
+defmodule ElixirNewbie.AcademyContent.Lesson do
   @enforce_keys [:id, :title, :body]
   defstruct [:id, :title, :body]
 

lib/elixir_newbie/blog/blog.ex

@@ -9,7 +9,8 @@ defmodule ElixirNewbieWeb.HomeLive do
     ~H"""
     <section class="flex h-fit w-full flex-col gap-12 4k:gap-36 lg:flex-row xl:gap-24">
       <article class="grid h-fit w-full grid-cols-6 grid-rows-6">
-        <article class="aspect-square relative col-start-1 col-end-6 row-start-1 row-end-6 rounded-full border-t-4 border-l-4 border-white">
+        <article class="aspect-square relative col-start-1 col-end-6 row-start-1 row-end-6 rounded-full">
+          <div class="absolute h-full w-full rounded-full border-t-4 border-l-4 border-white"/>
           <img
             class="rounded-full"
             alt="home page icon of a wizard"
@@ -18,42 +19,34 @@ defmodule ElixirNewbieWeb.HomeLive do
         </article>
         <.link
           href="https://twitter.com/BrooklinJMyers"
-          class="row-start-3 col-start-5 relative left-1/2 bottom-1/3 group animate-fade-in"
+          class="row-start-3 col-start-5 relative left-1/2 bottom-1/3 group"
         >
-          <div class="transition duration-300 ease-in-out group-hover:scale-110">
-            <div class="animate-spin-slow absolute h-full w-full rounded-full border-l-2 border-cyan-600"/>
-            <img alt="Twitter Icon Button" class="rounded-full border-2" src="images/twitter_icon_reduced.webp"/>
-          </div>
+          <div class="animate-fade-in absolute h-full w-full rounded-full border-4 border-dotted transition duration-300 ease-in-out group-hover:scale-110"/>
+          <img alt="Twitter Icon Button" class="rounded-full p-1" src="images/twitter_icon_reduced.webp"/>
           <p class="absolute -bottom-6 w-full text-center text-sm text-white">Twitter</p>
         </.link>
         <.link
           href="https://github.com/BrooklinJazz"
-          class="relative col-start-5 relative left-1/3 sm:left-1/4 row-start-4 group animate-fade-in"
+          class="relative col-start-5 relative left-1/3 sm:left-1/4 row-start-4 group"
         >
-          <div class="transition duration-300 ease-in-out group-hover:scale-110">
-            <div class="animate-spin-slow absolute h-full w-full rounded-full border-l-2 border-green-600"/>
-            <img alt="GitHub Icon Button" class="rounded-full border-2" src="images/github_icon_reduced.webp"/>
-          </div>
+          <div class="animate-fade-in absolute h-full w-full rounded-full border-4 border-dotted transition duration-300 ease-in-out group-hover:scale-110"/>
+          <img alt="GitHub Icon Button" class="rounded-full p-1" src="images/github_icon_reduced.webp"/>
           <p class="absolute -bottom-6 w-full text-center text-sm text-white">GitHub</p>
         </.link>
         <.link
           href="https://www.linkedin.com/in/brooklinmyers/"
-          class="row-start-5 col-start-4 relative left-1/2 group animate-fade-in"
+          class="row-start-5 col-start-4 relative left-1/2 group"
         >
-          <div class="transition duration-300 ease-in-out group-hover:scale-110">
-            <div class="animate-spin-slow absolute h-full w-full rounded-full border-l-2 border-blue-600"/>
-            <img alt="Linkedin Icon Button" class="rounded-full border-2" src="images/linkedin_icon_reduced.webp"/>
-          </div>
+          <div class="animate-fade-in absolute h-full w-full rounded-full border-4 border-dotted transition duration-300 ease-in-out group-hover:scale-110"/>
+          <img alt="Linkedin Icon Button" class="rounded-full p-1" src="images/linkedin_icon_reduced.webp"/>
           <p class="absolute -bottom-6 w-full text-center text-sm text-white">Linkedin</p>
         </.link>
         <.link
           href="https://github.com/DockYard-Academy/beta_curriculum"
-          class="row-start-5 col-start-3 relative left-1/4 top-1/2 group animate-fade-in"
+          class="row-start-5 col-start-3 relative left-1/4 top-1/2 group"
         >
-          <div class="transition duration-300 ease-in-out group-hover:scale-110">
-            <div class="animate-spin-slow absolute h-full w-full rounded-full border-l-2 border-black"/>
-            <img alt="DockYard Academy Icon Button" class="rounded-full border-2" src="images/dockyard_academy_icon_reduced.webp"/>
-          </div>
+          <div class="animate-fade-in absolute h-full w-full rounded-full border-4 border-dotted transition duration-300 ease-in-out group-hover:scale-110"/>
+          <img alt="DockYard Academy Icon Button" class="rounded-full p-1" src="images/dockyard_academy_icon_reduced.webp"/>
           <p class="absolute -bottom-12 w-full text-center text-sm text-white">DockYard Academy</p>
         </.link>
       </article>

lib/elixir_newbie_web/live/home_live.ex

@@ -5,14 +5,19 @@ defmodule ElixirNewbieWeb.ResourcesLive do
     ~H"""
     <section class="text-white">
       <p>Resources</p>
-      <%= for post <- @posts do %>
-        <%= raw post.body %>
+      <ul>
+      <%= for lesson <- @lessons do %>
+        <li>
+        <%= lesson.title %>
+        </li>
       <% end %>
+      </ul>
     </section>
     """
   end
 
   def mount(_params, _session, socket) do
-    {:ok, assign(socket, posts: ElixirNewbie.Blog.all_posts())}
+    lessons = ElixirNewbie.AcademyContent.all_lessons()
+    {:ok, assign(socket, lessons: lessons)}
   end
 end

lib/elixir_newbie_web/live/resources_live.ex

@@ -0,0 +1,28 @@
+defmodule Mix.Tasks.Sync do
+  @moduledoc "Sync DockYard Academy Content With Nimble Publisher"
+  use Mix.Task
+
+  @shortdoc @moduledoc
+  def run(_) do
+    Mix.Task.run("app.start")
+    url = "https://raw.githubusercontent.com/DockYard-Academy/beta_curriculum/main/start.livemd"
+
+    {:ok, %HTTPoison.Response{body: body}} = HTTPoison.get(url)
+
+    Regex.scan(~r/\* \[([^\]]+)\]\(([^\)]+)\)/, body)
+    |> Enum.each(fn [_full_match, title, file_name] ->
+      page_url =
+        "https://raw.githubusercontent.com/DockYard-Academy/beta_curriculum/main/#{file_name}"
+
+      {:ok, %HTTPoison.Response{body: markdown}} = HTTPoison.get(page_url)
+
+      File.write!("./priv/academy_content/#{Path.rootname(Path.basename(file_name))}.md", """
+      %{
+        title: "#{title}"
+      }
+      ---
+      #{markdown}
+      """)
+    end)
+  end
+end