Skip to content

A simple reproduction of the Shopify onboarding UI wth plain HTML, CSS, and vanilla JS.

License

Notifications You must be signed in to change notification settings

abdulramon-jemil/shopify-onboarding

Repository files navigation

Shopify onboarding UI

This project is a simple reproduction of the Shopify onboarding UI build with single index.html, app.css, and app.js files. I initially started the project to participate in the Level Up Front Hackathon 2023. The challenge was to recreate the design and functionality of the Shopify onboarding page and a Figma file was provided, but I could not finish the project before the deadline. However, I completed it, as it was so much fun. This repo contains all the code and some other files I used as my thinking board 😉.

Structure

The ~/src directory contains the source code for the project and other related files. The three main files of the project, index.html, app.css, and app.js are at the root of this directory. Other related files are nested in it. These are outlined below.

  • ~/src/__ref: contains related files, but they're not necessarily needed to run the project. This directory also contains the Figma file provided for the hackathon challenge.
  • ~/src/__images: contains the images which are referenced from the index.html file. Although these images are hosted on the hackathon website, including them in the project makes sense to avoid unnecessary external dependency, as the hackathon host might take those down in the future.

Notes

Thanks for checking out the project. Do reach out to me @abdulramonjemil if you would like to chat.

About

A simple reproduction of the Shopify onboarding UI wth plain HTML, CSS, and vanilla JS.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published