Muhammad Adnan

Dear Students,
The online platform for both Nursing and Diploma exam practice is ready! 🎓

✅ Register to get:
- MCQ practice for BSN and Diploma tracks
- Core subjects and clinical scenarios
- Study notes & quick revision sheets
- Progress tracking and self-review

🔥 _NEW: TEST COLLECTION_ 🔥
Find sets organized by program—BSN and Diploma—so you can:
- Practice by subject or semester
- Repeat tests to strengthen recall
- Focus on weak areas before finals

📱 Website: quizmaster.life

Tap “Get Started” on the homepage to create your account and begin practicing today!

Color Pallets 🎨👨‍💻

Frontend VS Backend

CSS Functions

Exploring alternatives to divs in React👨‍💻💻

Today we will explore the use of "div" in HTML and why it can cause problems in React JSX.

Next, we will delve into the solution provided by React Fragments and their features. Let's jump in!

Using "div" in HTML

1. Container:

- "div" is a generic container element used to group and style HTML sections.

2. Flexibility:

- It is widely used to structure and layout websites.

3. Styling:

- With CSS, "div" elements can be styled to create visually appealing layouts.

Problems using "div" in React JSX

1. Excessive DOM nodes:

- Wrapping elements in unnecessary "div" tags can lead to a bloated DOM, which can impact performance.

2. CSS overhead:

- Managing and styling multiple "div" elements can become cumbersome and messy.

3. Semantic issues:

Overusing "divs" can lead to poor semantic structure, making it difficult for screen readers and SEO.

Solution: React fragments

Fragments allow you to group a list of children without adding additional nodes to the DOM.

To wrap multiple elements, use the "Fragment" component or shortened syntax.

Fragment Features:

- Keeps the HOUSE clean by avoiding unnecessary packaging elements.

Reduces the number of DOM nodes, improving performance and rendering speed.

- Simplifies JSX code, making it more readable and maintainable.

- Allows you to add keys to fragments when mapping lists of items, similar to how you add keys to "div" elements.

Using React Fragments effectively can help you maintain a clean and efficient DOM structure, improve performance, and write more readable and maintainable code.

Embrace Fragments to avoid the pitfalls of overusing 'div' in your React applications.

Calculator 🧮 HTML, CSS and JS

https://muhammadadnan11.github.io/Javascript_Calculator/

Greetings and welcome to my page! 🌟 Here, I strive to provide you with timely updates on web development and curated study materials. My commitment is to deliver high-quality content that aids in your journey of acquiring knowledge in the field of web development. Your presence is highly appreciated, and I look forward to fostering a community where learning and professional growth thrive. 🚀 If you have any inquiries or if there's a specific topic you'd like to explore further, please don't hesitate to reach out. Thank you for joining me on this educational journey! 📚💻

To stand out for a promotion in web development you have to focus on mastering the following

1. Frontend framework such as React, Vue or Angular. I.e after getting a solid foundation on HTML, CSS, and JavaScript.

2. Proficiency in responsive web design and performance testing.

3. Get familiarize with version control system and debugging skills.

4. Embrace the clean code and best practices method.

5. Lastly is a soft skill such as collaboration and effective communication.