Open in app

Sign In

Write

Sign In

Joana Borges Late
Joana Borges Late

500 Followers

Home

About

Published in

JavaScript in Plain English

·Pinned

Replicating the Medium Website Using CSS Molecules

The perfect balance between CSS Zen Garden & Tailwind CSS — In the beginning, the gods wanted to help the communication among people. They created the HTML. And the humanity felt that it was simple and good. After millennia (3 years, actually) the gods decided to bring the web to life and whispered winds of JavaScript on our planet. And humanity…

HTML

14 min read

Replicating the Medium Website Using CSS Molecules
Replicating the Medium Website Using CSS Molecules
HTML

14 min read


Published in

Level Up Coding

·Pinned

Solving All CSS Layout Issues — any screen, any root font size, without JS

How to create a webpage that looks perfect on any device, no matter its screen width or the chosen root font size (no JS) — Today we will see how easy it is to create responsive webpages with fluid design. We will study the CSS template that solves the layout issues. Hire an architect to make the layout of a house. …

Web Development

20 min read

Solving All CSS Layout Issues — any screen, any root font size, without JS
Solving All CSS Layout Issues — any screen, any root font size, without JS
Web Development

20 min read


Published in

CodeX

·Pinned

Making Your Own JavaScript Linter (part 1)

A comprehensive tutorial — This is the first part of a comprehensive tutorial on constructing a JavaScript linter. A linter is a tool for checking source code. We will see the fundamental concepts and the source code of a real linter written in JavaScript, including algorithms for the tricky parts. Note: dirtyrat is the…

JavaScript

6 min read

Making Your Own JavaScript Linter (part 1)
Making Your Own JavaScript Linter (part 1)
JavaScript

6 min read


Published in

Level Up Coding

·Pinned

Handling User Input in Rich Browser Apps

The right architecture for handling mouse and keyboard events — Simple Application The browser (JavaScript) is very helpful about handling user input. For example: var doneButton = document.getElementById(“done”) doneButton.onclick = function () { sendDataToServer() } This is a simple and straightforward code that works perfectly well for the following context. The user spends a minute filling out a form with his data.

Event Handlers

9 min read

Handling User Input in Rich Browser Apps
Handling User Input in Rich Browser Apps
Event Handlers

9 min read


Published in

Geek Culture

·Pinned

Tricks for Efficient Shadow Effect in Pure JavaScript

How to handle the overlapping of source lights in a 2.5D browser game — In this article we will see how the light effects of the browser game Lost In Maze were made, in plain JavaScript, not using any library or WebGL. General performance Drawing sprites (images) on the browser canvas is a very efficient process. …

JavaScript

14 min read

Tricks for Efficient Shadow Effect in Pure JavaScript
Tricks for Efficient Shadow Effect in Pure JavaScript
JavaScript

14 min read


Published in

JavaScript in Plain English

·14 hours ago

What You Need to Know for Solving the Advent of Code Puzzles Blazingly Fast with JavaScript

Solving the year 2016 day 11 puzzle in half a minute — The purpose of this article is to show you some programming techniques in JavaScript (useful for other languages) that you will need when executing brute-force algorithms. Without using these techniques, your computer may run out of memory and/or your processor will be stressed for several minutes (even hours). I said…

JavaScript

17 min read

What You Need to Know for Solving the Advent of Code Puzzles Blazingly Fast with JavaScript
What You Need to Know for Solving the Advent of Code Puzzles Blazingly Fast with JavaScript
JavaScript

17 min read


May 7

Using data attributes instead of CSS classes
129
6

Matt Dawkins

Hello!

Hello! I found your article instructive. CSS is a mess, and we are always trying to create a system for handling it. I like the Molecular CSS (https://medium.com/javascript-in-plain-english/replicating-the-medium-website-using-css-molecules-7aa0849568e1). I don't see any problem in naming a class like "blue" or "red". It is very clear. Hardly a website changes its…

1 min read

1 min read


Apr 20

A Medium Page Rewrite Challenge : Part 2, The Markup
155
5

Jason Knight

Jason!

Jason! Again, thank you so much for participating in my little CSS contest. I feel honored and flattered. Doubly flattered because, in addition to your version, you wrote two long articles about it. I knew I would learn something from you again. I'm talking about the facades. In my defense…

4 min read

4 min read


Apr 17

Farewell to my Readers

For more than two decades, I have been suffering a progressive visual illness. This morning, the only eye that is still able to read had a small crisis. Therefore, I chose this moment to retire — before being forced to retire. I am leaving unfinished my project Web As You Wish. I think I made a good base there and would like to see somebody finishing it. I think that, by far, the most useful thing that I wrote about is the Molecular CSS. In case you want to have a (second) look:

Web Development

1 min read

Farewell to my Readers
Farewell to my Readers
Web Development

1 min read


Published in

JavaScript in Plain English

·Apr 13

Rewriting a Medium Webpage by Hand — 1 MB becomes 90 kB

Showing Molecular CSS in practice and other techniques — I wanted to prove that using CSS Molecules is indeed good. Therefore, I decided to show a real world example: the replica of an imaginary Medium article webpage. The current article is the continuation of Replicating the Medium Website-Using CSS Molecules. You find the replica here: the replica — development…

HTML

16 min read

Rewriting a Medium Webpage by Hand — 1 MB becomes 90 kB
Rewriting a Medium Webpage by Hand — 1 MB becomes 90 kB
HTML

16 min read

Joana Borges Late

Joana Borges Late

500 Followers

Creator of https://www.bobsprite.com and https://www.webasyouwish.com

Following
  • Xiuer Old

    Xiuer Old

  • Aphinya Dechalert

    Aphinya Dechalert

  • Mayank Choubey

    Mayank Choubey

  • Hajime Yamasaki Vukelic

    Hajime Yamasaki Vukelic

  • Mehulgadhiya

    Mehulgadhiya

See all (50)

Help

Status

Writers

Blog

Careers

Privacy

Terms

About

Text to speech

Teams