Month 5 Workshops

Certainly, here are four workshop scenarios, one for each week in Month 5, which focuses on Front-End Frameworks (Vue.js and React):

Week 1 Workshop: Vue.js Introduction

• Scenario: Build a To-Do List App with Vue.js

  • Description: In this workshop, students will create a simple To-Do List application using Vue.js. They will learn how to set up a Vue project, create Vue components, and use Vue directives for data binding. Students will build an interactive web app where they can add, update, and remove tasks.

Week 2 Workshop: Advanced Vue.js Features

• Scenario: Building a Blog with Vue Router and Pinia

  • Description: In this workshop, students will extend their Vue.js skills by building a blog application. They will explore advanced Vue Router concepts for navigation between blog posts and use Pinia for state management. Students will implement features like pagination and user comments.

Week 3 Workshop: Introduction to React

• Scenario: Creating a Recipe Finder App with React

  • Description: In this workshop, students will dive into React by building a Recipe Finder application. They will learn how to create React components, handle user input, and manage component state. Students will build a user-friendly app where they can search for recipes based on ingredients.

Week 4 Workshop: React Router and Comparing Vue.js vs. React

• Scenario: Building a Portfolio Website with React Router

  • Description: In this workshop, students will explore React Router by creating a personal portfolio website. They will set up different routes for portfolio sections like projects, blog, and contact information. Additionally, students will compare and contrast Vue.js and React by implementing similar functionality in both frameworks to understand their strengths and differences.

These workshops provide hands-on experience and practical projects to reinforce the concepts learned during the month. They allow students to apply their knowledge to real-world scenarios and build tangible web applications using Vue.js and React.