Barcelona, Spain

Alex Morgan.

Frontend Engineer · Fictional Demo

A fictional portfolio for testing MyDevStudio. Alex builds accessible interfaces and reusable product systems.

Working since 20231 roles, one evolving craft
SCROLL TO EXPLORE

About me

About me

A Brief Introduction to My Background and Interests

This is fictional demo content for exploring portfolio layouts, CVs and AI features.

Sample projects and experience can be edited without affecting any real portfolio.

Professional Experience

Professional Experience

A Summary of My Roles, Companies, and Projects

  1. Jan 2023 - Present

    Example Studio

    Frontend Engineer

    Built a reusable component library for sample products.

Projects & Contributions

Projects & Contributions

A showcase of my projects, tools and client work.

  • Studio Dashboard

    Frontend Engineer

    A fictional dashboard for exploring project cards, layouts and portfolio chat.

  • Component Library

    Creator

    A sample design system with reusable fields, cards and navigation.

Skills

Skills

My skills and areas of expertise

  • Frontend


    React
    TypeScript
    Next.js
  • Product quality


    Accessibility
    Responsive design
    Testing

Education & Credentials

Education & Credentials

Academic Background and Achievements

  1. Sep 2018 - Jun 2022

    Example University

    BSc in Computer Science

Languages

Languages

English (Fluent) · Spanish (Intermediate)

Demo feature checklist

Use the editor to switch layouts, themes and portfolio/CV languages. Try section ordering, compatible renderers, custom sections, templates, import/export and PDF settings. The sections below demonstrate the complete registered library. Some links are labeled placeholders; contact forms open an email draft and newsletter links need your own provider.

The private AI assistant proposes edits for review and draft apply. Saving remains explicit. Public AI chat requires an owner opt-in and a published portfolio. Use test cards in the Stripe sandbox. Demo allowances are limited and real AI requests consume the configured provider budget.

AI and billing ↗

Sample services

  • Interface development

    Fictional service content for testing section renderers.

Demo · About Hero

Explore the About Hero section with fictional content.

Alex Morgan

This is fictional demo content for exploring portfolio layouts, CVs and AI features.

Sample projects and experience can be edited without affecting any real portfolio.

Demo · About

Explore the About section with fictional content.

  • Alex Morgan

    This is fictional demo content for exploring portfolio layouts, CVs and AI features.

    Sample projects and experience can be edited without affecting any real portfolio.

Demo · Accordion

Explore the Accordion section with fictional content.

Accordion example
Accordion example

Demo only

2024–Present

Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

  • Sample detail one
  • Sample detail two
Accordion example ↗
Second fictional example
Second fictional example

Demo only

2022–2023

Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

  • Sample detail one
  • Sample detail two
Second fictional example ↗

Demo · Awards

Explore the Awards section with fictional content.

  • Awards example

    Awards example

    Demo only

    2024–Present

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Awards example ↗
  • Second fictional example

    Second fictional example

    Demo only

    2022–2023

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Second fictional example ↗

Demo · Blog Page

Explore the Blog Page section with fictional content.

  • Blog Page example

    Blog Page example

    Demo only

    2024–Present

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Blog Page example ↗
  • Second fictional example

    Second fictional example

    Demo only

    2022–2023

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Second fictional example ↗

Demo · CTA

Explore the CTA section with fictional content.

  • CTA example

    CTA example

    Demo only

    2024–Present

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    CTA example ↗
  • Second fictional example

    Second fictional example

    Demo only

    2022–2023

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Second fictional example ↗

Demo · Careers

Explore the Careers section with fictional content.

  • Careers example

    Careers example

    Demo only

    2024–Present

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Careers example ↗
  • Second fictional example

    Second fictional example

    Demo only

    2022–2023

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Second fictional example ↗

Demo · Clients

Explore the Clients section with fictional content.

Demo · Contact Form

Explore the Contact Form section with fictional content.

Your email app opens with this message. Send it there to contact the recipient.

Demo · FAQ

Explore the FAQ section with fictional content.

FAQ example
FAQ example

Demo only

2024–Present

Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

  • Sample detail one
  • Sample detail two
FAQ example ↗
Second fictional example
Second fictional example

Demo only

2022–2023

Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

  • Sample detail one
  • Sample detail two
Second fictional example ↗

Demo · Features

Explore the Features section with fictional content.

  • Studio Dashboard

    A fictional dashboard for exploring project cards, layouts and portfolio chat.

    • React
    • TypeScript
  • Component Library

    A sample design system with reusable fields, cards and navigation.

    • Accessibility
    • CSS

Demo · Heading

Explore the Heading section with fictional content.

Demo · Hero

Explore the Hero section with fictional content.

Hero example

Hero example

Demo only

2024–Present

Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

  • Sample detail one
  • Sample detail two
Hero example ↗

Second fictional example

Second fictional example

Demo only

2022–2023

Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

  • Sample detail one
  • Sample detail two
Second fictional example ↗

Demo · How To

Explore the How To section with fictional content.

  1. How To example

    How To example

    Demo only

    2024–Present

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    How To example ↗
  2. Second fictional example

    Second fictional example

    Demo only

    2022–2023

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Second fictional example ↗

Demo · Map

Explore the Map section with fictional content.

Demo · Menu

Explore the Menu section with fictional content.

  • Menu example

    Menu example

    Demo only

    2024–Present

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Menu example ↗
  • Second fictional example

    Second fictional example

    Demo only

    2022–2023

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Second fictional example ↗

Demo · Newsletter

Demonstration subscription link only; no mailing list is connected.

Subscribe ↗

Demo · Plans

Explore the Plans section with fictional content.

  • Plans example

    Plans example

    Demo only

    2024–Present

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Plans example ↗
  • Second fictional example

    Second fictional example

    Demo only

    2022–2023

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Second fictional example ↗

Demo · Posts Grid

Explore the Posts Grid section with fictional content.

  • Posts Grid example

    Posts Grid example

    Demo only

    2024–Present

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Posts Grid example ↗
  • Second fictional example

    Second fictional example

    Demo only

    2022–2023

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Second fictional example ↗

Demo · Pricing

Explore the Pricing section with fictional content.

  • Pricing example

    Pricing example

    Demo only

    2024–Present

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Pricing example ↗
  • Second fictional example

    Second fictional example

    Demo only

    2022–2023

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Second fictional example ↗

Demo · Profile

Explore the Profile section with fictional content.

  • Profile example

    Profile example

    Demo only

    2024–Present

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Profile example ↗
  • Second fictional example

    Second fictional example

    Demo only

    2022–2023

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Second fictional example ↗

Demo · Projects

Explore the Projects section with fictional content.

  • Studio Dashboard

    A fictional dashboard for exploring project cards, layouts and portfolio chat.

    • React
    • TypeScript
  • Component Library

    A sample design system with reusable fields, cards and navigation.

    • Accessibility
    • CSS

Demo · Property

Explore the Property section with fictional content.

  • Property example

    Property example

    Demo only

    2024–Present

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Property example ↗
  • Second fictional example

    Second fictional example

    Demo only

    2022–2023

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Second fictional example ↗

Demo · Quickstart

Explore the Quickstart section with fictional content.

  1. Quickstart example

    Quickstart example

    Demo only

    2024–Present

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Quickstart example ↗
  2. Second fictional example

    Second fictional example

    Demo only

    2022–2023

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Second fictional example ↗

Demo · Shop Items

Explore the Shop Items section with fictional content.

  • Shop Items example

    Shop Items example

    Demo only

    2024–Present

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Shop Items example ↗
  • Second fictional example

    Second fictional example

    Demo only

    2022–2023

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Second fictional example ↗

Demo · Stats

Explore the Stats section with fictional content.

  • Stats example

    Stats example

    3

    2024–Present

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Stats example ↗
  • Second fictional example

    Second fictional example

    4

    2022–2023

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Second fictional example ↗

Demo · Studies

Explore the Studies section with fictional content.

  1. BSc

    Sep 2018 - Jun 2022

    Computer Science · Example University

Demo · Table Of Contents

Explore the Table Of Contents section with fictional content.

Demo · Tabs

Explore the Tabs section with fictional content.

Tabs example

Demo only

2024–Present

Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

  • Sample detail one
  • Sample detail two
Tabs example ↗

Demo · Team

Explore the Team section with fictional content.

  • Team example

    Team example

    Demo only

    2024–Present

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Team example ↗
  • Second fictional example

    Second fictional example

    Demo only

    2022–2023

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Second fictional example ↗

Demo · Technical Skills

Explore the Technical Skills section with fictional content.

  • Frontend

    • React
    • TypeScript
    • Next.js
  • Product quality

    • Accessibility
    • Responsive design
    • Testing

Demo · Testimonials

Explore the Testimonials section with fictional content.

  • Testimonials example

    Testimonials example

    Demo only

    2024–Present

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Testimonials example ↗
  • Second fictional example

    Second fictional example

    Demo only

    2022–2023

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Second fictional example ↗

Demo · Text

Explore the Text section with fictional content.

This is fictional demo content for exploring portfolio layouts, CVs and AI features.

Sample projects and experience can be edited without affecting any real portfolio.

Demo · Timeline

Explore the Timeline section with fictional content.

  1. Frontend Engineer

    Jan 2023 - Present

    Example Studio

    • Built a reusable component library for sample products.
    • Improved keyboard access and responsive layouts in the fictional studio dashboard.
    Frontend Engineer ↗

Demo · Video

Explore the Video section with fictional content.

  • Video example

    Video example

    Demo only

    2024–Present

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Video example ↗
  • Second fictional example

    Second fictional example

    Demo only

    2022–2023

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Second fictional example ↗

Demo · Work Experience

Explore the Work Experience section with fictional content.

  1. Frontend Engineer

    Jan 2023 - Present

    Example Studio

    • Built a reusable component library for sample products.
    • Improved keyboard access and responsive layouts in the fictional studio dashboard.
    Frontend Engineer ↗

Demo · Custom

Explore the Custom section with fictional content.

Studio Dashboard

A fictional dashboard for exploring project cards, layouts and portfolio chat.

  • React
  • TypeScript

Component Library

A sample design system with reusable fields, cards and navigation.

  • Accessibility
  • CSS

Demo · YouTube

Explore the YouTube section with fictional content.

  • YouTube example

    YouTube example

    Demo only

    2024–Present

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    YouTube example ↗
  • Second fictional example

    Second fictional example

    Demo only

    2022–2023

    Fictional sample content for testing this section. Edit the content and switch its compatible layout in the studio.

    • Sample detail one
    • Sample detail two
    Second fictional example ↗

Demo layout · cards

Explore the Custom section with fictional content.

  • Studio Dashboard

    A fictional dashboard for exploring project cards, layouts and portfolio chat.

    • React
    • TypeScript
  • Component Library

    A sample design system with reusable fields, cards and navigation.

    • Accessibility
    • CSS

Demo layout · gallery

Explore the Custom section with fictional content.

Demo layout · masonry

Explore the Custom section with fictional content.

Studio Dashboard

A fictional dashboard for exploring project cards, layouts and portfolio chat.

  • React
  • TypeScript

Component Library

A sample design system with reusable fields, cards and navigation.

  • Accessibility
  • CSS

Demo layout · carousel

Explore the Custom section with fictional content.

Demo layout · accordion

Explore the Custom section with fictional content.

Studio Dashboard

A fictional dashboard for exploring project cards, layouts and portfolio chat.

  • React
  • TypeScript
Component Library

A sample design system with reusable fields, cards and navigation.

  • Accessibility
  • CSS

Demo layout · tabs

Explore the Custom section with fictional content.

A fictional dashboard for exploring project cards, layouts and portfolio chat.

  • React
  • TypeScript

Demo layout · timeline

Explore the Custom section with fictional content.

  1. Studio Dashboard

    A fictional dashboard for exploring project cards, layouts and portfolio chat.

    • React
    • TypeScript
  2. Component Library

    A sample design system with reusable fields, cards and navigation.

    • Accessibility
    • CSS

Demo layout · steps

Explore the Custom section with fictional content.

  1. Studio Dashboard

    A fictional dashboard for exploring project cards, layouts and portfolio chat.

    • React
    • TypeScript
  2. Component Library

    A sample design system with reusable fields, cards and navigation.

    • Accessibility
    • CSS

Demo layout · text

Explore the Custom section with fictional content.

A fictional dashboard for exploring project cards, layouts and portfolio chat.

  • React
  • TypeScript

A sample design system with reusable fields, cards and navigation.

  • Accessibility
  • CSS