Edie Home Page

Go Back
default descr of image
DemoRepo

The first page ( home page) of this site was created as a submission to a Dev Challenges.

But then I decided to continue creating new pages, using different technologies and approaches to implementation.

As a result, in this project I used:

  • Vite + Vue 3 (Options and Composition API)

  • In some places, I used the PUG preprocessor for HTML, just to show that I can use it in VUE

  • CSS variables and SCSS

  • Vue Router for navigation

  • Pinia for storage management

  • Different layouts system for pages

  • I used gulp.js for optimize images and create WEBP images

  • And of course, it's a fully responsive website. The burger menu is implemented on the mobile device.

I made interesting feature on page "Github", on which you can enter any GitHub username and get information about this.userName and all this public repositories.

Also on "Github page" :

  • i implement pagination component to show 5 repos on 1 page

  • user card component - which accept a string props "userName" - and render info after fetch data of this user.

On the slider page

  • I used the Swiper plugin for Vue. Not an easy one, but two, one is connected to the other. It turned out good, i think.

  • Instead of Lorem text, I used an API request and output 5 random phrases of famous people. it was also not an easy task to understand how Vue works with asynchronous requests.