Create a responsive seat selector UI in HTML, CSS, and JS

Sparen Sie mit 40% Rabatt auf 3 Monate Coursera Plus bei den Fähigkeiten, die Sie zum Strahlen bringen. Jetzt sparen

projekt ist nicht verfügbar in Deutsch (Deutschland)

Wir übersetzen es in weitere Sprachen.

Create a responsive seat selector UI in HTML, CSS, and JS

7.532 bereits angemeldet

Projekt

Beweisen Sie Arbeitgebern Ihre Fähigkeiten und nutzen Sie Branchentools, um reale Herausforderungen zu meistern.

Stufe Mittel

Empfohlene Erfahrung

5 hours

In Ihrem eigenen Tempo lernen

Projekt

Beweisen Sie Arbeitgebern Ihre Fähigkeiten und nutzen Sie Branchentools, um reale Herausforderungen zu meistern.

Stufe Mittel

Empfohlene Erfahrung

5 hours

In Ihrem eigenen Tempo lernen

Ziele

Prototype a responsive seat map visual layout maximizing cross-device usage
Connect the visual seat map to a grid of seats (columns and rows) to be used for booking
Change the controls dynamically, depending on screen size, to increase booking completions

Fähigkeiten, die Sie zeigen werden

Kategorie: User Interface (UI)
Kategorie: Web Design
Kategorie: Interactive Design
Kategorie: Cross Platform Development
Kategorie: HTML and CSS
Kategorie: User Interface (UI) Design
Kategorie: Responsive Web Design
Kategorie: Web Design and Development
Kategorie: Front-End Web Development
Kategorie: Javascript
Kategorie: Browser Compatibility

Tools, die Sie verwenden werden

Kategorie: Hypertext Markup Language (HTML)
Kategorie: Cascading Style Sheets (CSS)
Kategorie: Frontend Integration
Kategorie: UI Components

Wichtige Details

Arbeitsprobe zum Teilen

Zu Ihrem Coursera-Profil hinzufügen

Unterrichtet in Englisch

Keine Downloads oder Installation erforderlich

Verwenden Sie ein Coursera-Labor, vorkonfiguriert im Browser-Cloud-Workspace (nur für desktop verfügbar).

Erfahren Sie, wie Mitarbeiter führender Unternehmen gefragte Kompetenzen erwerben.

Weitere Informationen zu Coursera für Unternehmen

Logos von Petrobras, TATA, Danone, Capgemini, P&G und L'Oreal

Über dieses Projekt

In this project, you’ll support Sugarland Theaters’ effort to increase revenue by enabling guests to book their seats on the go using its web app.

You’re task is to build a responsive seat selector UI component, specifically a responsive web interface using HTML, CSS, and Javascript that lets guests manage their seat reservations with an interactive map and adapt the seat map to their device screen size. There isn’t just one right approach or solution in this scenario, which means you can create a truly unique project that helps you stand out to employers. ROLE: Software Developer SKILLS: HTML, CSS, Javascript PREREQUISITES: Media queries and layout modalities such as flexbox and grid with HTML5 and CSS Manage arrays, visual breakpoints and DOM interactions with Javascript

Projektplan

Für dieses Projekt müssen Sie die folgenden Schritte selbstständig ausführen:

Create a responsive visual layout
Create the seat/area map structure in Javascript
Switch between the desktop seat map and the areas mobile layout
Create the seat map detail of each seat area
Select a seat and send the data back to the server

von

Coursera

Demonstrieren Sie Ihre Kompetenzen mit Projekten

Mit Projekten erhalten Sie reale Herausforderungen, die Sie mit Branchentools lösen. Sie erhalten damit Arbeitsproben, die Sie zu Ihrem Kompetenzprofil bei Coursera hinzufügen können, um sich so bei Arbeitgebern von anderen Bewerbern abzuheben.

Mein Profil verwalten