diff --git a/design/Frontend-Design.md b/design/Frontend-Design.md index 6b81d9c..5fb56b5 100644 --- a/design/Frontend-Design.md +++ b/design/Frontend-Design.md @@ -1 +1,46 @@ -# TBD \ No newline at end of file +### 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 + +#### DRY +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