Explore TaskFlow Frontend Structure
Read and explore the real Vue.js 3 frontend code structure to understand component architecture, routing, and build configuration.
Lab Overview
🛠Lab from the Platform Engineering Bootcamp. Used in Week 6. Bootcamp landing page: https://academy.tekanaid.com/bootcamps/platform-engineering-bootcamp Parent course(s):
- Week 6: Python & JavaScript Foundations (slug: python-javascript-foundations)
🟡 Beta bootcamp lab. Hands-on instructions, check scripts, and solve scripts are in place. Lab is part of the running TaskFlow project that grows across all 21 weeks of the bootcamp.
Before you containerize an application, you need to understand how it works. In this lab, you will explore the actual TaskFlow frontend codebase, the same repository you forked back in Week 1. You will navigate the project structure, read the real Vue 3 Composition API components, see how Vue Router is fully wired up while Pinia is installed but has no store yet, examine the one live API call and the build tooling around it, and finish by reading the real multi-stage Dockerfile that already ships in the repo. This reading comprehension exercise builds the foundation you need to write correct Dockerfiles and debug container issues in later weeks.
What You'll Learn
Navigate a real Vue.js project cloned from the canonical TaskFlow repo
Read Vue 3 Composition API components (ref, onMounted, router-link)
Identify Vue Router routing patterns, including lazy-loaded routes
Recognize a dependency (Pinia) installed before any feature uses it
Trace the one live Axios API call and the Vite dev-server proxy around it
Recognize Vite and package.json config, including the dependencies vs devDependencies split
Read a real multi-stage Dockerfile and connect each stage back to the application
Prerequisites
Command-line basics (cd, ls, cat)
JavaScript fundamentals
Component architecture concepts
Technologies Covered
Choose your plan
Simple, Transparent Pricing
Unlock full access to TeKanAid courses, labs, and bootcamps
Just exploring? Start free below. Want the full experience? Try Premium free for 7 days (card required, $0 today).
Pro
All courses, with lab scripts to run on your own machine
Renews automatically. Cancel anytime.
Final price verified at checkout.
- Full access to all courses
- Lab scripts to download and run on your own machine (hosted labs not included)
- Progress tracking
- Certificate of completion
- Community access
- Bootcamp participation
- New content access
Premium
Full access, including unlimited hosted labs
Renews automatically. Cancel anytime.
Final price verified at checkout.
- Everything in Pro
- Unlimited hands-on labs, fully hosted on TeKanAid Academy (nothing to set up)
- Lab AI Assistant
- Accelerator bootcamps with live office hours
- Priority support
Prefer a single course?
Purchase individual courses for a one-time fee of $79. Full access to course content, quizzes, certificates, and community features, lab access is not included.
Browse CoursesJust exploring? Start free, no account needed
Three free ways to start. All bridge into the paid Premium catalog when you're ready.
Not ready to commit? The crash course is email-only. No academy account required.
Ready to Get Started?
Start this hands-on lab and build real-world Platform Engineering skills
Get Access Now