Sometimes you need to keep values stored locally, for example:

• to prevent data loss due to network failures.
• to keep unfinished editing for a long time (example, this editor)
• to exchange data between different pages without sending it to the server(implementing a shopping cart)

Combining fonts that get along together is a difficult task. Here are a few tips on how to select matching fonts.

Making the first letter different for articles is common in articles. This can be easily done in CSS.

To get clean designs you need to make good use of vertical rhythms. Different font sizes establishes hierarchy, and communicates meaning. This also needs to be considered when making responsive designs.

Design is about communicating ideas. The way design helps in that communication is based on different design principles. And this is especially important when creating a visual hieranchy.

Paying for a font is a difficult decision to make, especially when you are new to design, and not fully aware of how to decide if a given font worth it. Free fonts are the safest choices, but which one?

Using default local networks dns server frequently is not enough. Using additional dns servers helps a lot. Using google dns and some other services make a safe redundancy.

When designing beautiful web pages we have the tendency to fallback to the well know options. This most of the time reduces to Bootstrap and Material Design. If you want to offer flexibility in your design proposal is important to know what other frameworks in the market can offer to you.
I’ll be listing the different design frameworks I’m finding in the wild with notes on the pros and cons I find in them. If you want to keep updated with the list just subscribe.

Believes about mistakes can prevent teams from working at full speed. Your culture about mistakes makes the difference between being a top performing and someone from the heap. So, knowing how to approach mistakes in the most productive way and building a culture around that is a skill that will make the difference.

This video is kind of a map to the services we can find in amazon AWS.

A list of 50 PM terms that helps quickly refer to how to manage a project.

With so many free fonts, and especially for newcomers to design, it’s a daunting task selecting a font. There are many criteria to follow when selecting fonts, but for the untrained eye, deciding for one is very difficult. I depicted a very simple way to tell apart fonts that make bad work. See it in the article body.

Here you will can find some references to secure coding practices and how to test for security

There is the XP guide “Do the simplest thing that could possible work”, but how to tell apart simple from easy? Sometimes simple is easy, actually as a guide for me I say “Simple is easy to understand”, but sometime easy leads to complex, and most of the time getting something simple requires hard work. So, are there rules that help us get to simple design?

Not dealing with errors properly makes difficult to get readable code. These are a few guidelines on how to properly deal with them.

Here you are going to find a list of sites where I usually look for fonts. Many of the fonts are free and many are for a fee.
Remember the WAVONIMALIMELOMU test to tell quality fonts apart.

I looked for resources that allowed me to learn about this topic, and make my web designs better. After searching the web a found a few interesting resources.

The principle defines that objects of a superclass shall be replaceable with objects of its subclasses without breaking the application.

Also important to create a sitemap.xml file

Software entities (classes, modules, functions, etc.) should be open for extension but closed for modification.

Starbucks and Kraft’s Coffee Conflict
What happens to a negotiated business agreement when it becomes undesirable over time

Use case, we want to know how much time an element has been visible. For example, an ad before refresh.

Adding an extra level of security is increasingly important to avoid our data from being stolen. Using two factor authentication is a simple yet effective way to accomplish this goal.

Easy Understanding
Easy of Change
Easy of Debugging
Flexibility

• policy
• location

Properly hashing is difficult. Some popular hashing algorithms have been probed vulnerable (MD5)
So, here are a couple of options that allow to hash in a cryptographically safe way.

Using the MessageChannel for this.

supporting https is mandatory for current sites. It’s not always obvious how to get a server that properly deals with this issue.

The interface-segregation principle (ISP) states that no client should be forced to depend on methods it does not use.

Requiring a schema to validate JSON data is a common task.
Usually, you start by simply sending the data to the service. As more data is added, one day dealing with data complexity turns out to be difficult.
So, validating that the data is as expected turns out mandatory.
The simplest way to come up with a first schema to be used for validation is to generate it based on json data.
In this post I present two tools that helps pull off this task very easly.

Commands frequently used in git for branch management.

The web-vitals library is a tiny (~1K), modular library for measuring all the Web Vitals metrics on real users, in a way that accurately matches how they’re measured by Chrome and reported to other Google tools (e.g. Chrome User Experience Report, Page Speed Insights, Search Console’s Speed Report).

The library supports all of the Core Web Vitals as well as all of the other Web Vitals that can be measured in the field:

Using navigator.sendBeacon and Fetch to send analytics data.

UI Frameworks like bootstrap, material design, tailwindcss come with a lot of CSS helper classes to enable you with flexibility in the design of which you end up using only a small fraction. At the time of creating the production file you end up with big files that slow down your pages loading and degrade the user experience.
Getting rid of all css classes that are not used is a simple way to optimize your pages performance.

Markdown is an easy-to-follow way to write styled documents. Sometimes you need to recall some of its shortcuts, this is an easy guide.

Creating illustrations can be a time consuming task. This framework helps making this easy and in addition they are 3D and interactive. Cool uh!!

Creating your own npm libraries is useful if you want to smoothly share your code between projects.

Sometimes is simpler to mount a remote folder if you access it frequently.

Keeping your javascripts light is something pressured by UX requirements. Pages with big javascripts tend to load slowly, on the other hand for a provider is difficult to know in advance what tools to include because they are known only when the script is run.

Documentation…I hate it…but sometimes I just need it.

Selecting a font is a core design task.

One of my favorite frameworks for providing negative feedback is the CEDAR™ model from Anna Wildman. CEDAR is an acronym for the steps involved in providing feedback.

High-level modules, which provide complex logic, should be easily reusable and unaffected by changes in low-level modules, which provide utility features.

Sometimes when you are editing a resource, if someone else edits it at the same time you could end up overriding the other person changes.
In order to avoid this, implementing an Etag could solve the issue.

If you want to load again and again a resource that is heavy, you could implement a kind of cache. This can be done implementing Etag in https.

Sometimes you need to implement a download link in a web page.

Having unique ids is a frequent need. Sometimes using a database can help on this but at the cost of speed. Here are a few faster alternatives.

Mindsets are a set of believes that you acquire during your life that shortcut your decision making. They are based on stories, cultural approach to problems and are shortcuts to the complexity we find in life. They help us in arriving to conclusions quickly and to make decisions effortless but some of them limit our possibilities. Identifying those mindsets allow us to increase our chances of success.

Adding backlinks to a website helps in allowing people to find it on the web.
There are tools that helps you out to add them and to verify how many already exists.

A better design makes it easier to make changes.

An alternative to SOLID when the problem is not clear enough to get to a sound design.

Technical debt are decisions we make during development that we know are not optimal because they require more work to get optimal but we decide to deal with the consequences because we see more value in delivering at that time.

The importance of using the right metrics
"When a measure becomes a target, it ceases to be a good measure."

A chrome extension is a useful way to add functionalities to web pages as users. They may help in getting ideas on improvement for pages, also as a way to streamline processes that are thought be to done manually but when done many times they turn error prone and repetitive.

Free api is an option.

Some examples of solving problem using functional programming style.

To make code easier to read, highlighting the syntax is the way to go.
Using ‘prismjs’ is an easy way to do this. Also with the benefit that prims already support several languages.

A class should have one, and only one, reason to change.

Different ways of implementing Core Web Vitals

How to stop closing a page with unsaved changes.

Creating a Multidimensional array in javascript.

Success] requires less routine deployment of well-learned skills and more “thinking through” and “figuring out” of challenging new problems. Indeed, the pursuit of any challenging goal often involves actively analyzing tasks and then planning, self-monitoring, and revising strategies.

Webpack is the best tool to bundle resources for javascript. It makes easy to organize your resources and bundle them into files that are ready for production. Also, it has a very flexible plugin system that extends its functionality beyond its core.

There are two ways of constructing a software design

Really excellent video on how to replace inheritance with composition in javascript.

Heroku dyno filesystems are ephemeral, non-persistant and not shared between dynos. So when you do heroku run bash, you actually get a new dyno with a fresh deployment of you app without any of the changes made to ephemeral filesystems in other dynos. So, to be able to manage files on web using Heroku you have to resort to other solutions. See a couple in the note details…