Let’s build a Live Code Editor with just a few lines of HTML and CSS!

You have almost certainly styled anchor elements before using their pseudo-classes (, , , ) but you probably never thought about what strictly means.

Apparently, the pseudo-class can select elements for styling that…


Interactive, clickable images and animated closable popup boxes are usually tasks for JavaScript. But what if I told you it can all be done with just HTML and CSS?

Demo of the example project

All you need is HTML and CSS

This is an example project from my book, All you need is HTML and CSS:

https://www.amazon.co.uk/dp/B08ZQ3NSYF/ref=sr_1_1


This is the digital version of the CSS-only analog clock we built last time. It’s fully functioning, settable .. all done with CSS Custom Properties and the function and no JavaScript of course.

To get started with the project, have a look at the CSS-only Analog Clock first.

All you need is HTML and CSS

This…


Let’s build a fully-functioning, settable analog clock with CSS Custom Properties and the function. Next week, we will convert it to a digital clock .. all this with no JavaScript 😱

All you need is HTML and CSS

This is an example project from my book, All you need is HTML and CSS:

https://www.amazon.co.uk/dp/B08ZQ3NSYF/ref=sr_1_1
https://www.amazon.com/All-you-need-HTML-CSS/dp/B08ZQ3NSYF/ref=sr_1_2

There…


Let’s build a simple, no-JavaScript carousel you can swipe on both mobile and desktop. We will even add deep-linking to individual slides from buttons or unique URLs!

All you need is HTML and CSS

This is an example project from my book, All you need is HTML and CSS:

https://www.amazon.co.uk/dp/B08ZQ3NSYF/ref=sr_1_1
https://www.amazon.com/All-you-need-HTML-CSS/dp/B08ZQ3NSYF/ref=sr_1_2

There are many other examples in…


What if I told you it’s possible to program real-world electric components with React? Yes, that’s right! You can get electric sensors to update a React component’s state and switch circuits on and off based on state and props.

All this with React Hooks!

Why?

I’ve been using React for over…


Link and jump to different sections of your webpage with animated page scroll and without using a single line of JavaScript!

All you need is HTML and CSS

This is the first example project from my book, All you need is HTML and CSS:

https://www.amazon.co.uk/dp/B08ZQ3NSYF/ref=sr_1_1
https://www.amazon.com/All-you-need-HTML-CSS/dp/B08ZQ3NSYF/ref=sr_1_2

There are many other examples in the book pushing the limits…


I think I covered most of the buzzwords in that title. Maybe I could squeeze in “Smart” and “Lasers” to make it complete!

To be fair, most of the services used in this project are existing AWS services and the actual work I did was to make all these services…


In this series of posts, (after a brief introduction in Part 1) you will learn how to build a circuit with an LED light and the Arduino UNO and switch it on and off from JavaScript inside the Node.js environment (go to Part 2). …


In this series of posts, (after a brief introduction in Part 1) you will learn how to build a circuit with an LED light and the Arduino UNO and switch it on and off from JavaScript inside the Node.js environment (this post). …

Mate Marschalko

Senior Front-end Web Developer, Creative Technologist with over 12 years experience. Loves pushing the limits of HTML and CSS.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store