⭐ How to Write Good Commit Messages

▶️ feat Commits, that adds or remove a new feature
▶️ fix Commits, that fixes a bug
▶️ refactor Commits, that rewrite/restructure your code, however does not change any API behaviour
- - - - - - - - - - - - - - - - - - - - - - - -
▶️ perf Commits are special refactor commits, that improve performance
▶️ style Commits, that do not affect the meaning (white-space, formatting, missing semi-colons, etc)
▶️ test Commits, that add missing tests or correcting existing tests
- - - - - - - - - - - - - - - - - - - - - - - -

docs: Add Git commit message convention guidelines 😎

▶️ docs Commits, that affect documentation only
▶️ build Commits, that affect build components like build tool, ci pipeline, dependencies, project version, ...
▶️ ops Commits, that affect operational components like infrastructure, deployment, backup, recovery, ...
▶️ chore Miscellaneous commits e.g. modifying .gitignore

References 🔥

https://www.conventionalcommits.org/en/v1.0.0/

Next Post: git branch naming convention🎤

✅ How to Name Git Branches the Right Way

A quick guide to Git branch naming for better team collaboration. Learn how to maintain consistency in your project’s structure by using clear, denoscriptive branch names that everyone can follow.

▶️ Feature: feature/{short-denoscription}
Example: feature/login-page

▶️ Bugfix: fix/{issue-id}-{short-denoscription}
Example: fix/123-broken-link

⚡️ Read more on this here: 👇🏽

https://blog.siltawi.com/post/best-practices-for-git-branch-names/

⭐ Semantic Versioning (SemVer)

is a versioning system that conveys meaning about the changes made in a release. The version format is:

MAJOR.MINOR.PATCH
Example: 2.5.3

▶️ MAJOR: Breaking changes. (Incompatible with previous versions)

▶️ MINOR: New features, but backward-compatible.

▶️ PATCH: Bug fixes or small improvements that don't add features.

SemVer helps maintain predictable updates by communicating the level of change, ensuring developers know when to expect compatibility or breaking changes.

References 🔥

🔗 https://semver.org/

⭐ Shadcn

If you are looking for a way to build modern, stylish, and accessible web applications with Next.js, Vite, Remix, and Laravel, then Shadcn is a great option.

Start with some sensible defaults, then customize the components to your needs.🔥

https://ui.shadcn.com/

⭐ This is for educational purposes only🙅‍♂️.

If you are a backend developer, you need to know how to protect your API. On this site, you can find common vulnerabilities and weaknesses. Check out the article and test your API. If you discover a vulnerability, fix it before someone else 😴 hacks it.

We will also post the top vulnerabilities most developers encounter.🔥

Check it out: OWASP API Security Top 10

⭐ Web Tip: Why Add Version Numbers to CSS & JavaScript Files?

Have you seen ?v=1.0.0 at the end of a CSS or JavaScript link? 🤔 It’s called cache busting!

When you update your website’s design or noscripts, browsers may keep showing an old version to speed things up. Adding a version number like ?v=1.0.0 tells the browser, "This is the newest version!" 🆕

This trick helps:
▶️ Make sure users see the latest updates without clearing cache
▶️ Keep track of different versions as you work
▶️ Keep things running smoothly with easy updates

So next time you update, bump up that version number!
Happy coding! 👨‍💻

⚡️ Read more on this here: 👇🏽
https://blog.siltawi.com/post/web-development-tip-versioning-in-css-javanoscript-files/

#WebDev #CSS #JavaScript #CacheBusting #CodingTips #Frontend

🔥 Developer Roadmaps 2024 Part 🚩

ከየት መጀመር እና እንዴት በቀላሉ መማር እንዳለብን የሚረዳን ሮድማፕ/ ፍኖተ ካርታ 😵‍💫

Step by step guides and paths to learn different tools or technologies . ✔️

🚩🚩 Software Design Architecture
🔗 https://roadmap.sh/software-design-architecture

🚩🚩 System Design
🔗 https://roadmap.sh/system-design

🚩🚩 Game Developer
🔗 https://roadmap.sh/game-developer

🚩🚩 Software Architect
🔗 https://roadmap.sh/software-architect

🚩🚩 API Security Best Practices
🔗https://roadmap.sh/best-practices/api-security

🚩🚩 API Design
🔗 https://roadmap.sh/api-design

⭐ Role-Based Access Control (RBAC)

Did you use access control in your project⁉️
RBAC is one of the most effective methods to implement access control for secure and organized system management.

RBAC restricts access based on roles assigned to users, ensuring they can only perform actions permitted by their role.

Key Components
▶️ Roles: Define job functions (e.g., Admin, Editor, Viewer).
▶️ Permissions: Actions allowed (e.g., create, read, update, delete).
▶️ Users: Assigned roles to inherit permissions.

Example
| Role | Permissions |
|-----------|-------------------------|
| Admin | Create, Read, Update, Delete |
| Viewer | Read |

💡 Benefits: Simplifies access management, enforces least privilege, and enhances security.

💡 Important: When working with APIs, always implement access control to prevent unauthorized actions and protect sensitive data.

Next Post: Attribute-Based Access Control (ABAC)🎤

⭐ Lazy Loading for Better Performance

Did you use lazy loading in your project⁉️

Lazy loading delays loading non-essential resources like images, videos, and noscripts until needed.

🤩 Example

<img src="placeholder.jpg" data-src="real-image.jpg" loading="lazy" alt="Image">

💡 Benefits
▶️ Faster page loads 🔥
▶️ Saves bandwidth 📉
▶️ Improves user experience 🌟

Next Post: SSR vs. CSR ⚡️

#tips

⭐ Attribute-Based Access Control (ABAC)

ABAC extends RBAC by introducing attributes as the basis for access control decisions, allowing more dynamic and granular access management. Instead of relying solely on predefined roles, ABAC uses the attributes of users, resources, and the environment to determine access rights.

Key Components
1. Attributes:
- User Attributes: e.g., Department, Job Title, Clearance Level.
- Resource Attributes: e.g., File Type, Data Sensitivity.
- Environmental Attributes: e.g., Time of Access, Device Used, Location.

2. Policies: Define rules based on attributes, often written in formats like JSON or XML.

Example Policy
| Condition | Access Allowed |
|-------------------------------------------|----------------------------|
| Department = "HR" AND File Type = "PDF" | View or Download Only |
| Clearance Level = "High" AND Time = "9:00 AM - 6:00 PM" | Read, Write, Delete |

💡 Benefits:
- Flexibility: Adapts to complex requirements.
- Granularity: Offers fine-tuned control over resources.
- Dynamic Security: Responds to real-time conditions like location or device type.

💡 Use Case:
ABAC is ideal for systems that require context-sensitive decisions, such as granting access to sensitive financial data only during business hours or limiting operations based on device security.

⭐Let me tell you a story about one of the top private universities in Ethiopia. The university fired 🎆 one of its IT managers 👨‍💻 but forgot to remove his access to the grade management system. At first, no one noticed anything wrong.

But later, a teacher found something strange. He had given a student a D grade,...

⚡️ Read more on this here: 👇🏽
https://blog.siltawi.com/post/what-is-attribute-based-access-control-abac/

⭐ Your Gateway To Earn An International Degree: Unlock Exclusive Scholarships

This is your chance to:
▶️ Connect with experts who’ll show you how to access our prestigious international partner universities and incredible scholarship opportunities 🏫
▶️ Enjoy free drinks 🥤, delicious food 🍕, and get into the spirit with fun games 🎉and great music 🎵 to keep the energy flowing!


📅 Date: Saturday and Sunday, December 7–8, 2024 (ኅዳር 28-29, 2017)
⏰ Time: 9:00 AM (ከ3፡00 ሰዓት ጀምሮ)
📍 Location: CAPSTONE ALX TECH HUB, LIDET
📌 RSVP Here: https://bit.ly/41agewO

It’s going to be an unforgettable day, and we want YOU to be a part of it! Don’t wait—register now to secure your spot!

⭐ SSR vs. CSR: Which to Choose?

Understanding the difference between Server-Side Rendering (SSR) and Client-Side Rendering (CSR) is crucial for web development. Here's a quick breakdown:

🤩Server-Side Rendering (SSR)
▶️ Renders pages on the server before sending them to the browser.
💡 Best for SEO and initial load speed.

🖥 Client-Side Rendering (CSR)
▶️ Renders pages in the browser using JavaScript.
💡 Great for highly interactive apps.

Example Frameworks:

SSR: Next.js
CSR: React

💡 When to Choose

✅ Use SSR for SEO-heavy websites like blogs or e-commerce.
✅ Use CSR for single-page applications with high interactivity.

⚡️ Next Post: How to Optimize Images Like a Pro 🎤

⭐ How to Optimize Images Like a Pro 📸

Large image files can slow down your site. Here's how to keep it fast and efficient!

🔧Tips for Image Optimization
▶️ Compress Images
💡 Use tools like TinyPNG, Imagecompressor, or built-in features in frameworks.

▶️ Choose the Right Format
- JPEG: Best for photos.
- PNG: Use for graphics with transparency.
- WebP: Smaller file sizes with good quality.

▶️ Lazy Load Images
- <img loading="lazy" src="image.jpg" alt="Image">

▶️ Set Proper Dimensions
- Resize images to match their display size.

💡 Bonus: Use CDNs like Cloudflare or AWS for faster delivery.