Merge pull request #2130 from codeeu/2122-create-mooc-page

2122 create mooc page

resources/lang/en/menu.php

@@ -16,6 +16,7 @@
     'teach' => 'Teach',
     'training' => 'Training',
     'challenges' => 'Challenges',
+    'online-courses' => 'Online Courses',
     'toolkits' => 'Presentations and Toolkits',
     'why' => 'Why',
     'home' => 'Home',

resources/lang/en/online-courses.php

@@ -0,0 +1,11 @@
+<?php
+
+return [
+    'title' => 'EU CODE WEEK ONLINE COURSES',
+    'description' => [
+        "EU Code Week offers professional development opportunities in the form of massive open online courses (MOOCs) with the aim to support teachers in effectively incorporating coding and computational thinking into their teaching practice.",
+        "EU Code Week MOOCs are open to all educators, regardless of their students' age or the subject they teach, and no prior experience or knowledge is required to participate.",
+        "EU Code Week MOOCs offer free and accessible resources, materials, ideas and best practice examples to find inspiration and empower students by introducing coding and computational thinking, emerging technologies and artificial intelligence safely into the classroom."
+    ],
+    'more-info' => "More information about the EU Code Week MOOCs: "
+];

resources/views/components/cards/online-courses.blade.php

@@ -0,0 +1,31 @@
+@props([
+'bgColor' => '#DEEBF4',
+'url',
+'title',
+'img',
+'date' ,
+'description'
+])
+<div style="background-color:{{$bgColor}}; line-height: 22px;" class="mt-8 p-8">
+
+    <div class="flex flex-row">
+        <div class="basis-1/2">
+            <h2>
+                <a target="_blank" href="{{$url}}">{{$title}}</a></h2>
+            <div class="mt-2 pr-6">
+                {{$description}}
+            </div>
+        </div>
+        <div class="basis-1/2 relative">
+            <a target="_blank" href="{{$url}}"><img
+                        src="{{asset('/img/online-courses/'.$img)}}"
+                         class="max-w-sm">
+                <div class="absolute bottom-0 left-0 right-0 p-4 bg-black bg-opacity-50 text-white">
+                    {{$date}}
+                </div>
+            </a>
+        </div>
+
+    </div>
+
+</div>

resources/views/layout/base.blade.php

@@ -49,8 +49,12 @@
     <meta name="description"
           content="October 7 - 22, 2023: a week to celebrate coding in Europe, encouraging citizens to learn more about technology, and connecting communities and organizations who can help you learn coding."/>
 
+    @hasSection('title')
+        <title>EU Code Week - @yield('title')</title>
+    @else
+        <title>EU Code Week</title>
+    @endif
 
-    <title>EU Code Week</title>
 
 
 

resources/views/layout/menu.blade.php

@@ -22,6 +22,7 @@
                 <ul>
                     <li><a href="{{route('coding@home')}}">@lang('menu.coding@home')</a></li>
                     <li><a href="/podcasts">Podcasts</a></li>
+                    <li><a href="{{route('online-courses')}}">Online Courses</a></li>
                     <li><a href="{{route('training.index')}}">@lang('menu.training')</a></li>
                     <li><a href="{{route('challenges')}}">@lang('menu.challenges')</a></li>
                     <li><a href="{{route('dance')}}">@lang('snippets.dance.menu')</a></li>

resources/views/online-courses.blade.php

@@ -0,0 +1,139 @@
+@extends('layout.base')
+
+@section('title', 'Online Courses')
+
+<x-tailwind></x-tailwind>
+@section('content')
+
+    <section id="codeweek-about-page" class="codeweek-page">
+
+        <section class="codeweek-banner about">
+            <div class="text">
+                <h2>EU Code Week</h2>
+                <h1>Online Courses</h1>
+            </div>
+            <div class="image">
+                <img src="/images/banner_training.svg" class="static-image">
+            </div>
+        </section>
+
+        <section id="online-courses">
+
+            <div class="m-12">
+<div class="m-6 -mb-8">
+            <h1>@lang('online-courses.title')</h1>
+
+            <p style="margin-top:-30px;">
+                @lang('online-courses.description.0')
+                <br/><br/>
+                @lang('online-courses.description.1')
+                <br/><br/>
+                @lang('online-courses.description.2')
+                <br/><br/>
+                @lang('online-courses.more-info')
+            </p>
+</div>
+{{--            <x-cards.online-courses--}}
+{{--                    title="Navigating Innovative Technologies Across the Curriculum"--}}
+{{--                    url=""--}}
+{{--                    date="9 September – 15 October 2023"--}}
+{{--                    img="navigating-innovative-technologies-across-the-curriculum.png"--}}
+{{--                    description="This course welcomes educators interested in integrating coding, computational thinking, virtual and augmented reality into their classrooms through interdisciplinary and cross-curricular projects, encouraging exploration of innovative technologies and their effective use."--}}
+{{--                            >--}}
+{{--            </x-cards.online-courses>--}}
+
+            <x-cards.online-courses
+                    title="Unlocking the Power of AI in Education"
+                    url="https://www.europeanschoolnetacademy.eu/courses/course-v1:CodeWeek+AI_Education+2023/about"
+                    date="13 March – 19 April 2023"
+                    img="unlocking-the-power-of-ai.png"
+                    description="The Unlocking the Power of AI in Education MOOC aims to provide teachers with a basic understanding of AI's potentials and challenges in education, safe and effective use of educational data, ethical implications of AI in the classroom and the implementation of AI-related resources and materials in teaching practice."
+                            >
+            </x-cards.online-courses>
+
+            <x-cards.online-courses
+                    title="EU Code Week Bootcamp 2022"
+                    url="https://www.europeanschoolnetacademy.eu/courses/course-v1:CodeWeek+Bootcamp+2022/about"
+                    description="The EU Code Week Bootcamp is designed for teachers who want to integrate coding and computational thinking into their classrooms with practical ideas and resources, while promoting diversity and inclusion in coding and exploring the potentials of artificial intelligence in education."
+                    date="10 October – 16 November 2022"
+                    img="eu-code-week-bootcamp-2022.jpg"
+                            >
+            </x-cards.online-courses>
+
+            <x-cards.online-courses
+                    title="EU Code Week Online Bootcamp"
+                    url="https://www.europeanschoolnetacademy.eu/courses/course-v1:CodeWeek+OnlineBootcamp+2021/about"
+                    date="27 September – 27 October 2021"
+                    img="eu-code-week-online-bootcamp.jpg"
+                    description="The EU Code Week Online Bootcamp introduces teachers to the EU Code Week initiative and the opportunities it offers. Pre-primary, primary, and secondary school teachers are provided with practical ideas, tools, and resources for incorporating coding and computational thinking into the classroom."
+            >
+            </x-cards.online-courses>
+
+            <x-cards.online-courses
+                    title="AI Basics for Schools"
+                    url="https://www.europeanschoolnetacademy.eu/courses/course-v1:CodeWeek+AI+2021/about"
+                    description="The course introduces teachers to the basic concepts of AI. It provides them with examples of effective use of AI in the classroom and supports them in the integration and creation of AI-related activities in the classroom. Teachers learn to recognize and raise awareness of threats and benefits of AI and examine the ethical use of AI."
+                    date="8 March – 7 April 2021"
+                    img="ai-basics-for-schools.jpg"
+            >
+            </x-cards.online-courses>
+
+            <x-cards.online-courses
+                    title="EU Code Week Deep Dive MOOC 2020"
+                    url="https://www.europeanschoolnetacademy.eu/courses/course-v1:CodeWeek+CWDive+2020/about"
+                    description="The course aims to raise awareness about integrating coding and computational thinking into the classroom, familiarize teachers with innovative tools and approaches, offer free training materials in 29 languages, teach how to register activities for the EU Code Week initiative, explore the Code Week 4 all challenge and foster a community of enthusiastic teachers for best practice sharing."
+                    date="16 September – 20 October 2020"
+                    img="eu-code-week-deep-dive-mooc-2020.jpg"
+            >
+            </x-cards.online-courses>
+
+            <x-cards.online-courses
+                    title="EU Code Week Icebreaker Rerun"
+                    url="https://www.europeanschoolnetacademy.eu/courses/course-v1:CodeWeek+Icebreaker+2020/about"
+                    description="This short introductory course aims to make EU Code Week more appealing and meaningful for teachers, schools, and parents while raising awareness about the importance of integrating coding and computational thinking into their lesson. Learning how to code can empower students to be at the forefront of a digitally competent society, develop a better understanding of the world that surrounds them, and increase their chances to succeed in their personal and professional lives."
+                    date="11 May – 15 June 2020"
+                    img="icebreaker.jpg"
+            >
+            </x-cards.online-courses>
+
+            <x-cards.online-courses
+                    title="EU Code Week - Deep Dive MOOC"
+                    url="https://www.europeanschoolnetacademy.eu/courses/course-v1:CodeWeek+CWDive+2019/about"
+                    description="The course aims to help participants understand the importance of integrating coding and computational thinking in the classroom, become familiar with innovative tools and approaches, gain basic knowledge of the Code.org CS fundamentals curriculum, access free training materials and resources, explore the EU Code Week campaign, including activity registration and reporting."
+                    date="16 September – 30 October 2019"
+                    img="eu-code-week-deep-dive-mooc-2019.png"
+            >
+            </x-cards.online-courses>
+
+            <x-cards.online-courses
+                    title="EU Code Week - Ice-breaker MOOC"
+                    url="https://www.europeanschoolnetacademy.eu/courses/course-v1:CodeWeek+Icebreaker+2019/about"
+                    description="The course aims to introduce participants to EU Code Week and familiarize with the new EU Code Week website for schools, explore and access free lesson plans to register activities for EU Code Week, discover various classroom support resources, and become acquainted with the toolkit designed for teachers."
+                    date="3 – 26 June 2019"
+                    img="icebreaker-2019.png"
+            >
+            </x-cards.online-courses>
+
+            </div>
+
+        </section>
+
+
+    </section>
+
+@endsection
+
+@section("extra-css")
+    <style>
+        #online-courses a, #online-courses a:visited {
+            color: #FE6824;
+            text-decoration: none; /* Optional: Remove underline from links */
+        }
+
+        #online-courses a:hover {
+            color: #D6551B; /* Darker shade of orange for hover */
+        }
+
+
+    </style>
+@endsection

routes/web.php

@@ -595,13 +595,12 @@ function () {
 Route::get('/unsubscribe/{email}/{magic}', 'UnsubscribeController@index')->name('unsubscribe');
 
 
-
-
 Route::group(['middleware' => ['auth']], function () {
     Route::get('activities-locations', 'LocationController@index')->name('activities-locations');
 });
 
-Route::view('/registration', 'registration.add');
+//Route::view('/registration', 'registration.add');
+Route::view('/online-courses', 'online-courses')->name('online-courses');
 
 Route::get('mailing/test', function(){