Add Course Shelf CTA to bootcamp details page

Adds a Course Shelf call-to-action banner on bootcamp pages that
links to Course Shelf with a pre-filled search for the bootcamp topic.

Changes:
- Add Course Shelf CTA badge below bootcamp title
- Create sanitize_bootcamp_name helper to clean search terms:
  - Remove "expert" and "development" keywords
  - Replace "node backend" with "Node.js"
- Include UTM tracking (source: techschool, campaign: bootcamp_details)
- Add bilingual support (EN: "on Course Shelf", PT: "no Course Shelf")

The CTA uses the same purple-themed styling as the homepage banner
for consistency across the site.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <[email protected]>

Author: danielbergholz

lib/techschool_web/live/bootcamp_live/show.ex

@@ -27,9 +27,18 @@ defmodule TechschoolWeb.BootcampLive.Show do
       page_description
     )
     |> assign(:bootcamp, bootcamp)
+    |> assign(:bootcamp_search_name, sanitize_bootcamp_name(bootcamp.name))
     |> ok()
   end
 
+  defp sanitize_bootcamp_name(name) do
+    name
+    |> String.replace(~r/expert/i, "")
+    |> String.replace(~r/development/i, "")
+    |> String.replace(~r/node\s+backend/i, "Node.js")
+    |> String.trim()
+  end
+
   def build_lesson_url(locale, lesson) do
     cond do
       lesson.language_names != "" ->

lib/techschool_web/live/bootcamp_live/show.html.heex

@@ -10,6 +10,24 @@
 
     <h1 class="text-xl md:text-2xl font-bold mt-2 text-center">{@bootcamp.name}</h1>
   </div>
+
+<!-- Course Shelf CTA -->
+  <a
+    href={"https://thecourseshelf.com/courses?search=#{URI.encode(@bootcamp_search_name)}&utm_source=techschool&utm_medium=banner&utm_campaign=bootcamp_details"}
+    target="_blank"
+    rel="noreferrer"
+    class="group inline-flex items-center justify-center gap-3 px-6 py-3 bg-purple-900/30 border border-purple-700/50 hover:border-purple-600 rounded-xl backdrop-blur-sm transition-all duration-200 ease-out hover:scale-[1.02] active:scale-95 transform focus:outline-none focus:ring-2 focus:ring-purple-500/50 focus:ring-offset-2 focus:ring-offset-slate-900 mb-6"
+  >
+    <img
+      src={~p"/images/courseshelf-logo.svg"}
+      alt="Course Shelf"
+      class="w-5 h-5 md:w-6 md:h-6 shrink-0"
+    />
+    <span class="text-sm md:text-base font-medium text-purple-200 group-hover:text-white transition-colors">
+      {@bootcamp_search_name} {gettext("on Course Shelf")}
+    </span>
+  </a>
+
   <div class="flex flex-col justify-center gap-6 md:gap-8">
     <.lesson_card
       :for={lesson <- @bootcamp.lessons}

priv/gettext/default.pot

@@ -11,7 +11,7 @@
 msgid ""
 msgstr ""
 
-#: lib/techschool_web/live/page_live/home.html.heex:84
+#: lib/techschool_web/live/page_live/home.html.heex:70
 #, elixir-autogen, elixir-format
 msgid "Free technology education for everyone"
 msgstr ""
@@ -25,7 +25,7 @@ msgstr ""
 #: lib/techschool_web/components/layouts/components/navbar.html.heex:17
 #: lib/techschool_web/components/layouts/components/navbar_live.ex:35
 #: lib/techschool_web/live/course_live/index.ex:44
-#: lib/techschool_web/live/page_live/home.html.heex:186
+#: lib/techschool_web/live/page_live/home.html.heex:172
 #, elixir-autogen, elixir-format
 msgid "Courses"
 msgstr ""
@@ -35,7 +35,7 @@ msgstr ""
 msgid "Developed by"
 msgstr ""
 
-#: lib/techschool_web/live/page_live/home.html.heex:161
+#: lib/techschool_web/live/page_live/home.html.heex:147
 #, elixir-autogen, elixir-format
 msgid "Our mission"
 msgstr ""
@@ -46,7 +46,7 @@ msgstr ""
 msgid "close"
 msgstr ""
 
-#: lib/techschool_web/live/page_live/home.html.heex:87
+#: lib/techschool_web/live/page_live/home.html.heex:73
 #, elixir-autogen, elixir-format
 msgid "Go from zero to your first job without any financial loss"
 msgstr ""
@@ -56,12 +56,12 @@ msgstr ""
 msgid "Translate"
 msgstr ""
 
-#: lib/techschool_web/live/page_live/home.html.heex:164
+#: lib/techschool_web/live/page_live/home.html.heex:150
 #, elixir-autogen, elixir-format
 msgid "TechSchool is all about making tech education accessible to everyone for free. There are tons of awesome courses online, but we don't have big bucks for marketing. So, newbies often run into the expensive courses first, making it seem like you have to shell out a ton of money."
 msgstr ""
 
-#: lib/techschool_web/live/page_live/home.html.heex:170
+#: lib/techschool_web/live/page_live/home.html.heex:156
 #, elixir-autogen, elixir-format
 msgid "That's where TechSchool steps in. We're here to shine a light on those awesome free courses that might be flying under the radar. Our website has a bunch of courses covering different areas. The goal? Help anyone go from zero to landing their first job without breaking the bank. We want to tackle the expensive course culture and make tech education fair and equal for everyone."
 msgstr ""
@@ -102,7 +102,7 @@ msgstr ""
 msgid "TechSchool offers a variety of bootcamps to help you learn the skills you need to start a new career in tech."
 msgstr ""
 
-#: lib/techschool_web/live/bootcamp_live/show.html.heex:22
+#: lib/techschool_web/live/bootcamp_live/show.html.heex:40
 #, elixir-autogen, elixir-format
 msgid "Back"
 msgstr ""
@@ -124,12 +124,12 @@ msgstr ""
 msgid "Fundamentals"
 msgstr ""
 
-#: lib/techschool_web/live/page_live/home.html.heex:218
+#: lib/techschool_web/live/page_live/home.html.heex:204
 #, elixir-autogen, elixir-format
 msgid "Huge thanks to our contributors"
 msgstr ""
 
-#: lib/techschool_web/live/page_live/home.html.heex:246
+#: lib/techschool_web/live/page_live/home.html.heex:232
 #, elixir-autogen, elixir-format
 msgid "Add course to TechSchool"
 msgstr ""
@@ -193,17 +193,17 @@ msgid "new"
 msgstr ""
 
 #: lib/techschool_web/components/layouts/components/navbar.html.heex:24
-#: lib/techschool_web/live/page_live/home.html.heex:193
+#: lib/techschool_web/live/page_live/home.html.heex:179
 #, elixir-autogen, elixir-format
 msgid "Bootcamps"
 msgstr ""
 
-#: lib/techschool_web/live/page_live/home.html.heex:181
+#: lib/techschool_web/live/page_live/home.html.heex:167
 #, elixir-autogen, elixir-format
 msgid "Platform Statistics"
 msgstr ""
 
-#: lib/techschool_web/live/page_live/home.html.heex:198
+#: lib/techschool_web/live/page_live/home.html.heex:184
 #, elixir-autogen, elixir-format
 msgid "Total Views"
 msgstr ""
@@ -222,3 +222,8 @@ msgstr ""
 #, elixir-autogen, elixir-format
 msgid "Introducing Course Shelf - A Better Learning Experience"
 msgstr ""
+
+#: lib/techschool_web/live/bootcamp_live/show.html.heex:27
+#, elixir-autogen, elixir-format
+msgid "on Course Shelf"
+msgstr ""

priv/gettext/en/LC_MESSAGES/default.po

@@ -11,7 +11,7 @@ msgstr ""
 "Language: en\n"
 "Plural-Forms: nplurals=2; plural=(n != 1);\n"
 
-#: lib/techschool_web/live/page_live/home.html.heex:84
+#: lib/techschool_web/live/page_live/home.html.heex:70
 #, elixir-autogen, elixir-format
 msgid "Free technology education for everyone"
 msgstr ""
@@ -25,7 +25,7 @@ msgstr ""
 #: lib/techschool_web/components/layouts/components/navbar.html.heex:17
 #: lib/techschool_web/components/layouts/components/navbar_live.ex:35
 #: lib/techschool_web/live/course_live/index.ex:44
-#: lib/techschool_web/live/page_live/home.html.heex:186
+#: lib/techschool_web/live/page_live/home.html.heex:172
 #, elixir-autogen, elixir-format
 msgid "Courses"
 msgstr ""
@@ -35,7 +35,7 @@ msgstr ""
 msgid "Developed by"
 msgstr ""
 
-#: lib/techschool_web/live/page_live/home.html.heex:161
+#: lib/techschool_web/live/page_live/home.html.heex:147
 #, elixir-autogen, elixir-format
 msgid "Our mission"
 msgstr ""
@@ -46,7 +46,7 @@ msgstr ""
 msgid "close"
 msgstr ""
 
-#: lib/techschool_web/live/page_live/home.html.heex:87
+#: lib/techschool_web/live/page_live/home.html.heex:73
 #, elixir-autogen, elixir-format, fuzzy
 msgid "Go from zero to your first job without any financial loss"
 msgstr ""
@@ -56,12 +56,12 @@ msgstr ""
 msgid "Translate"
 msgstr "Traduzir"
 
-#: lib/techschool_web/live/page_live/home.html.heex:164
+#: lib/techschool_web/live/page_live/home.html.heex:150
 #, elixir-autogen, elixir-format
 msgid "TechSchool is all about making tech education accessible to everyone for free. There are tons of awesome courses online, but we don't have big bucks for marketing. So, newbies often run into the expensive courses first, making it seem like you have to shell out a ton of money."
 msgstr ""
 
-#: lib/techschool_web/live/page_live/home.html.heex:170
+#: lib/techschool_web/live/page_live/home.html.heex:156
 #, elixir-autogen, elixir-format
 msgid "That's where TechSchool steps in. We're here to shine a light on those awesome free courses that might be flying under the radar. Our website has a bunch of courses covering different areas. The goal? Help anyone go from zero to landing their first job without breaking the bank. We want to tackle the expensive course culture and make tech education fair and equal for everyone."
 msgstr ""
@@ -102,7 +102,7 @@ msgstr ""
 msgid "TechSchool offers a variety of bootcamps to help you learn the skills you need to start a new career in tech."
 msgstr ""
 
-#: lib/techschool_web/live/bootcamp_live/show.html.heex:22
+#: lib/techschool_web/live/bootcamp_live/show.html.heex:40
 #, elixir-autogen, elixir-format
 msgid "Back"
 msgstr ""
@@ -124,12 +124,12 @@ msgstr ""
 msgid "Fundamentals"
 msgstr ""
 
-#: lib/techschool_web/live/page_live/home.html.heex:218
+#: lib/techschool_web/live/page_live/home.html.heex:204
 #, elixir-autogen, elixir-format
 msgid "Huge thanks to our contributors"
 msgstr ""
 
-#: lib/techschool_web/live/page_live/home.html.heex:246
+#: lib/techschool_web/live/page_live/home.html.heex:232
 #, elixir-autogen, elixir-format
 msgid "Add course to TechSchool"
 msgstr ""
@@ -193,17 +193,17 @@ msgid "new"
 msgstr ""
 
 #: lib/techschool_web/components/layouts/components/navbar.html.heex:24
-#: lib/techschool_web/live/page_live/home.html.heex:193
+#: lib/techschool_web/live/page_live/home.html.heex:179
 #, elixir-autogen, elixir-format
 msgid "Bootcamps"
 msgstr ""
 
-#: lib/techschool_web/live/page_live/home.html.heex:181
+#: lib/techschool_web/live/page_live/home.html.heex:167
 #, elixir-autogen, elixir-format
 msgid "Platform Statistics"
 msgstr ""
 
-#: lib/techschool_web/live/page_live/home.html.heex:198
+#: lib/techschool_web/live/page_live/home.html.heex:184
 #, elixir-autogen, elixir-format
 msgid "Total Views"
 msgstr ""
@@ -222,3 +222,8 @@ msgstr ""
 #, elixir-autogen, elixir-format, fuzzy
 msgid "Introducing Course Shelf - A Better Learning Experience"
 msgstr ""
+
+#: lib/techschool_web/live/bootcamp_live/show.html.heex:27
+#, elixir-autogen, elixir-format
+msgid "on Course Shelf"
+msgstr ""

priv/gettext/pt/LC_MESSAGES/default.po

@@ -11,7 +11,7 @@ msgstr ""
 "Language: pt\n"
 "Plural-Forms: nplurals=2; plural=(n != 1);\n"
 
-#: lib/techschool_web/live/page_live/home.html.heex:84
+#: lib/techschool_web/live/page_live/home.html.heex:70
 #, elixir-autogen, elixir-format
 msgid "Free technology education for everyone"
 msgstr "Ensino de tecnologia acessível para todos"
@@ -25,7 +25,7 @@ msgstr ""
 #: lib/techschool_web/components/layouts/components/navbar.html.heex:17
 #: lib/techschool_web/components/layouts/components/navbar_live.ex:35
 #: lib/techschool_web/live/course_live/index.ex:44
-#: lib/techschool_web/live/page_live/home.html.heex:186
+#: lib/techschool_web/live/page_live/home.html.heex:172
 #, elixir-autogen, elixir-format
 msgid "Courses"
 msgstr "Cursos"
@@ -35,7 +35,7 @@ msgstr "Cursos"
 msgid "Developed by"
 msgstr "Desenvolvido por"
 
-#: lib/techschool_web/live/page_live/home.html.heex:161
+#: lib/techschool_web/live/page_live/home.html.heex:147
 #, elixir-autogen, elixir-format
 msgid "Our mission"
 msgstr "Nossa missão"
@@ -46,7 +46,7 @@ msgstr "Nossa missão"
 msgid "close"
 msgstr ""
 
-#: lib/techschool_web/live/page_live/home.html.heex:87
+#: lib/techschool_web/live/page_live/home.html.heex:73
 #, elixir-autogen, elixir-format, fuzzy
 msgid "Go from zero to your first job without any financial loss"
 msgstr "Saia do zero até o primeiro emprego sem ter nenhum prejuízo financeiro"
@@ -56,12 +56,12 @@ msgstr "Saia do zero até o primeiro emprego sem ter nenhum prejuízo financeiro
 msgid "Translate"
 msgstr "Translate"
 
-#: lib/techschool_web/live/page_live/home.html.heex:164
+#: lib/techschool_web/live/page_live/home.html.heex:150
 #, elixir-autogen, elixir-format
 msgid "TechSchool is all about making tech education accessible to everyone for free. There are tons of awesome courses online, but we don't have big bucks for marketing. So, newbies often run into the expensive courses first, making it seem like you have to shell out a ton of money."
 msgstr "O TechSchool foi criado pra tornar o ensino em tecnologia acessível pra todo mundo, de graça. Tem muitos cursos bons na internet, mas a gente não tem dinheiro infinito pra gastar em marketing. Então quem tá começando geralmente esbarra nos cursos caros primeiro, dando a impressão de que precisa gastar muito dinheiro pra entrar na área."
 
-#: lib/techschool_web/live/page_live/home.html.heex:170
+#: lib/techschool_web/live/page_live/home.html.heex:156
 #, elixir-autogen, elixir-format
 msgid "That's where TechSchool steps in. We're here to shine a light on those awesome free courses that might be flying under the radar. Our website has a bunch of courses covering different areas. The goal? Help anyone go from zero to landing their first job without breaking the bank. We want to tackle the expensive course culture and make tech education fair and equal for everyone."
 msgstr "É aí que o TechSchool entra na jogada. Estamos aqui para destacar aqueles cursos gratuitos incríveis que podem passar despercebidos. Nosso site oferece uma variedade de cursos em diferentes áreas. A meta é ajudar qualquer pessoa a sair do zero e conseguir o primeiro emprego sem gastar dinheiro. Queremos combater a cultura de bootcamps caros e tornar a educação em tecnologia justa e acessível para todos."
@@ -102,7 +102,7 @@ msgstr "Linguagem de programação"
 msgid "TechSchool offers a variety of bootcamps to help you learn the skills you need to start a new career in tech."
 msgstr "TechSchool oferece uma variedade de bootcamps para ajudar você a aprender as habilidades necessárias para começar uma nova carreira em tecnologia."
 
-#: lib/techschool_web/live/bootcamp_live/show.html.heex:22
+#: lib/techschool_web/live/bootcamp_live/show.html.heex:40
 #, elixir-autogen, elixir-format
 msgid "Back"
 msgstr "Voltar"
@@ -124,12 +124,12 @@ msgstr "Pesquisa sem resultados"
 msgid "Fundamentals"
 msgstr "Fundamentos"
 
-#: lib/techschool_web/live/page_live/home.html.heex:218
+#: lib/techschool_web/live/page_live/home.html.heex:204
 #, elixir-autogen, elixir-format
 msgid "Huge thanks to our contributors"
 msgstr "Agradecimento aos contribuidores"
 
-#: lib/techschool_web/live/page_live/home.html.heex:246
+#: lib/techschool_web/live/page_live/home.html.heex:232
 #, elixir-autogen, elixir-format
 msgid "Add course to TechSchool"
 msgstr "Adicionar curso no TechSchool"
@@ -193,17 +193,17 @@ msgid "new"
 msgstr "novo"
 
 #: lib/techschool_web/components/layouts/components/navbar.html.heex:24
-#: lib/techschool_web/live/page_live/home.html.heex:193
+#: lib/techschool_web/live/page_live/home.html.heex:179
 #, elixir-autogen, elixir-format
 msgid "Bootcamps"
 msgstr ""
 
-#: lib/techschool_web/live/page_live/home.html.heex:181
+#: lib/techschool_web/live/page_live/home.html.heex:167
 #, elixir-autogen, elixir-format
 msgid "Platform Statistics"
 msgstr "Estatísticas da plataforma"
 
-#: lib/techschool_web/live/page_live/home.html.heex:198
+#: lib/techschool_web/live/page_live/home.html.heex:184
 #, elixir-autogen, elixir-format
 msgid "Total Views"
 msgstr "Total de visualizações"
@@ -222,3 +222,8 @@ msgstr "Carregando mais cursos..."
 #, elixir-autogen, elixir-format
 msgid "Introducing Course Shelf - A Better Learning Experience"
 msgstr "Apresentando Course Shelf - Uma Experiência de Aprendizado Melhor"
+
+#: lib/techschool_web/live/bootcamp_live/show.html.heex:27
+#, elixir-autogen, elixir-format
+msgid "on Course Shelf"
+msgstr "no Course Shelf"