Member-only story

Javascript Desktop Dynamic Landing Page with Quotes API

YvonneDev
3 min readOct 16, 2021

--

The simple desktop view always catches our eyes, which is popular nowadays. It can be live in your browser. You may know some Google extensions related which have some functions like clock, to-do list, quotes or bookmarks.

The project’s idea is from Brad Traversy's tutorial. I kinda add something more. The site shows the digital clock, editable user name, background changing based on the time, and a random quote with API.

Github code

HTML

Google Font named Darker Grotesque

Three sections: time,h1for greeting name, and h2 for quotes

The name should be editable with “contenteditable=true”

CSS

Center box in the page.

Add a underline to second part.

JAVASCRIPT

select the DOM needed with id

--

--

YvonneDev
YvonneDev

Written by YvonneDev

❤️Front-end Web Development self-taught *share what I learned*

No responses yet