DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’» is a community of 964,423 amazing developers

We're a place where coders share, stay up-to-date and grow their careers.

Create account Log in
Cover image for SOLID Principles Sketches
Oleksii Trekhleb
Oleksii Trekhleb

Posted on • Updated on

SOLID Principles Sketches

I've recently launched the minimalistic drawing app okso.app that allows you to do interactive (nested) sketches. And, as a continuation of my previous S.O.L.I.D. Principles Around You article, I've organised it in interactive sketches that you may find here.

Check what I've got:

Image description

So, each SOLID principle has a dedicated sketch page that look like the following

Image description

Single Responsibility Principle

SRP Sketch

A class should have only a single responsibility. Only one potential change in the software’s specification should be able to affect the specification of the class.

Image description

Open/Closed Principle

OCP Sketch

Software entities should be open for EXTENSION, but closed for MODIFICATION. Allow behavior to be extended without modifying the source code.

Image description

Liskov Substitution Principle

LSP Sketch

Objects in a program should be replaceable with instances of their subtypes without altering the correctness of that program.

Image description

Interface Segregation Principle

ISP Sketch

Many client-specific interfaces are better than one general-purpose interface. No client should be forced to depend on methods it does not use.

Image description

Dependency Inversion Principle

DIP Sketch

One should depend upon abstractions, not concretions.

  • High-level modules should not depend on low-level modules. Both should depend on abstractions.
  • Abstractions should not depend on details. Details should depend on abstractions.

Image description

In the future I plan to add more visual explainers like this one to the okso.app showcase. Currently there is a Data Structures sketch is available that is done in a similar style as SOLID one. I hope having such visual explainers in one place will be convenient for you.

Top comments (10)

Collapse
 
perssondennis profile image
Dennis Persson

Just one thing to mention: This is a genius article.

Collapse
 
jakub_zalas profile image
Jakub Zalas

The tool looks great! I especially like the page concept to organise scetches in nested structures.

I might try it as a replacement for excalidraw.

Collapse
 
mteheran profile image
Miguel Teheran

Nice way to explain SOLID principles

Collapse
 
ryannerd profile image
Ryan Jentzsch

I've always had trouble explaining to new devs what the Liskov Substitution Principle means. This is the perfect example.

Collapse
 
maame_afia profile image
Maame Afia Fordjour

This is great.

Collapse
 
cesar_mostacero profile image
Cesar Mostacero

Awesome!

Collapse
 
mariuszmalek profile image
Mariusz Malek

Amazing article!

Collapse
 
mayallo profile image
Mohamed Mayallo • Edited on

What a surprise!

I have intended to write articles about the SOLID principles and indeed have already written about the SRP and OCP.

You can check them out here:

Collapse
 
hcamacho4200 profile image
Henry Camacho

Wow very nice both the app and solid presentations

Collapse
 
fruntend profile image
fruntend

Π‘ongratulations πŸ₯³! Your article hit the top posts for the week - dev.to/fruntend/top-10-posts-for-f...
Keep it up 🫰

Visualizing Promises and Async/Await 🀯

async await

☝️ Check out this all-time classic DEV post