feat: high level clean code content

design/Frontend-Design.md

@@ -1 +1,46 @@
-# TBD
+### Clean code
+
+#### Variables
+Give meaningful names to variables
+
+#### Functions
+1. Function name should describe what it does.
+2. A function should do only one thing.
+3. Limit the amount of function parameters, preferably two. if you need more you can send the parameters inside an object.
+4. If you find yourself writing the same code more than once, even if its a little bit different, try to generalize it in to a function.
+5. Functions should be pure
+
+#### Classes
+
+#### React components
+1. Make your React component as short as possible
+2. Name Your Components Using Standard Naming Conventions
+3. Reduce the number of props to the minimum
+4. Put Independent Functions Outside of Your Custom Hooks
+5. Split your components to container and presentational components
+6. Folderize Your Components
+
+#### DTY
+DRY is an acronym that stands for "Don’t Repeat Yourself."
+If you find yourself writing the same code in different places, consider writing it only once and just reuse it, whether as a function or as a component.
+
+#### KISS
+KISS is an acronym that stands for "Keep it simple stupid."
+
+#### SOLID
+Single Responsibility Principle (SRP)
+Open/Closed Principle (OCP)
+Liskov Substitution Principle (LSP)
+Interface Segregation Principle (ISP)
+Dependency Inversion Principle (DIP)
+
+
+#### Testing
+When you write your code, you should write it in a way it would be easy to test it. make your code predictable and testable.
+
+#### Error handling
+
+#### Comments
+If you write clean code, it should be self commenting.
+
+#### Type script