Muhammad Hassan J.

Enhance Your ReactJS Skills Here is the 4th mini-react project with source code. What you'll learn from this project: 1. How to use useContext in larger applications 2. Implementing modal popups in React.js 3. Structuring components effectively 🔗 GitHub repo: https://lnkd.in/eiUFATSK 🌐 Live demo: https://lnkd.in/eUfuq3-n All Projects with Source Code: https://lnkd.in/ddBJejp2 #ReactJS #Javascript #NodeJs #WebDevelopment #OpenSource #NextJS

٣

Lect_16 Why Dependency Injection | Dagger Hilt | DI | Notes App | Jetpack Compose | MVVM | Clean Architecture | Android With Rashid Saleem https://lnkd.in/dykXUS_P #Lect16 #DependencyInjection #Dagger #Hilt #DI #NotesApp #JetPackCompose #Compose #jetpack #android #MVVM #MVI #CleanArchitecture #NoteApp #Room #CleanCode

٥

https://lnkd.in/dEnBTzGx Important #Flutter 3.22 updates: 1. Web assembly stable support. 2. Graphics rendering enhancements. 3. Preview of Vertex AI for Firebase in Dart. 4. Widget state properties improvements. 5. Dynamic view sizing improvements. 6. Flavor-conditional asset bundling. #Flutter

٧

Always look at the standard library in most languages. For flutter keep your eye toward the flutter publisher. One other point to the list, consider if a security hole is worth it. Every 3rd party package used is a declaration of trust. You need to decide if the chance of a gap is worth it.

١٠

In this playlist you can learn:- 1- Spring JDBC Template 2- ORM 3- JPA and Hibernate 4- Spring Data JPA 5- Best practices for persistence layer https://lnkd.in/dcaKfh_C

١٦٧

١٩ تعليق

#ReactNative 0.74 onwards all files in #android src are created by default with #kotlin.

٩

OOPS concept in JavaScipt & TypeScript ==================================== Encapsulation :  1. In JavaScript, encapsulation is achieved by using closures and access modifiers, such as the private and public keywords. 2. In NestJS, encapsulation is observed in how services and controllers are constructed and used. 3. In TypeScript, we can achieve encapsulation using access modifiers (public, private, protected).  TypeScript supports the use of accessors, also known as getters and setters, to provide controlled access to class properties.  Getters and setters allow us to define custom logic when retrieving or assigning property values, enabling better encapsulation and validation. https://lnkd.in/dmnxtsFj Inheritance : 1. In JavaScript, inheritance is achieved by using the prototype property and the Object.create() method. 2. TypeScript supports single inheritance, where a class can inherit from a single base class.  TypeScript supports multiple inheritance using Interfaces https://lnkd.in/dzmwxrcw Polymorphism : 1. In JavaScript, polymorphism is achieved by using function overloading and function overriding. 2. TypeScript supports polymorphism through inheritance and interfaces. 3. Generics in TypeScript are a way to implement parametric polymorphism. https://lnkd.in/djuEEsHF Abstraction : 1. In TypeScript, abstraction is achieved through classes and interfaces. 2. In JavaScript, the concept of an abstract class is not natively supported as it is in other languages such as Java, TypeScript, and Python. https://lnkd.in/dk53uGjM #oops #javascript #typescript

١٣٧

٥ تعليق

This is a simple web application that explain CRUD operations "Create, Read, Update, Delete" implemented by ASP.Net MVC Core with code first approach. Mentorship by Dr. Abeer Saber 🛠️Tools & Technologies: •C#, MS SQL Server, LINQ, Entity Framework Core, ASP.Net MVC Core, Bootstrab classes, tag helper 📃Models: •Book, Category Relation one to many ‏📕GitHub Repo: [https://lnkd.in/dxSfGxsw] ‏#Csharp #OOP #Database #MicosoftSQLServer #SQLServer #LINQ #WinForms #DevExpress #ORM #ADO #Dapper #EntityFrameworkCore #ASPDotNetMVCCore #MVC #DotNet #ASP.Net #SelfStudy

٨٦

١٦ تعليق

🚀 Kotlin Multiplatform Learning Roadmap 🚀 📚 Kotlin Basics - Variables, Functions, Classes, and Objects - Null Safety and Collections - Extensions and Lambdas 🔄 Kotlin Coroutines & Flow - Coroutine Basics and Builders - Suspending Functions and Scopes - Flow Basics and Operators 🛠️ Kotlin Multiplatform (KMP) Introduction - Understanding Multiplatform Projects - Common, Platform-Specific Code - Expect/Actual Mechanism 🚀 Setting Up a KMP Project - Creating a New Multiplatform Project - Configuring Gradle for KMP - Setting Up Android and iOS Targets 💻 Sharing Business Logic - Writing Common Business Logic - Shared Data Models and Repositories - Dependency Injection with Koin or Hilt 🌐 Networking in KMP - Ktor for Networking - Implementing REST API Calls - Handling JSON with Kotlinx Serialization 💾 Data Storage in KMP - Shared Preferences or Settings - SQLDelight for Multiplatform Databases - Working with Files and Caches 🔧 Platform-Specific Implementations - Expect/Actual Implementations for APIs - Using Platform-Specific Features (e.g., Camera, Location) - Integrating with Native Android/iOS Libraries 🧪 Multiplatform Testing - Unit Testing with Kotlin Test - Writing Platform-Specific Tests - Mocking and Dependency Injection in Tests 🎨 UI Development - Jetpack Compose for Android - SwiftUI or UIKit for iOS - Exploring Compose Multiplatform (Optional) 📦 Dependency Management - Managing Multiplatform Dependencies - Gradle Dependency Management - Library Compatibility and Versioning 🔍 Debugging & Optimization - Debugging Multiplatform Projects - Performance Tuning for KMP - Handling Platform-Specific Bugs ⚙️ Advanced KMP Topics - Multithreading and Concurrency in KMP - Interoperability with Java/Swift - Gradle Build Optimization 🚢 Deployment - Building for Android and iOS - App Store/Play Store Deployment - Continuous Integration/Continuous Deployment (CI/CD) 🌍 Community and Learning - Kotlin Multiplatform Forums and Groups - Attending Conferences and Meetups - Contributing to Open-Source Projects Happy learning! 📚 Learning Material https://lnkd.in/dGFVKmcu JetBrains Android Developers Google Developer Experts #androiddev #kotlin

١٤٤

١٨ تعليق

Understanding AJAX API Calls vs. React/Angular API Calls API calls are essential to web applications, allowing data flow between client and server. AJAX, React, and Angular each handle these calls with unique underlying mechanisms that shape how data is fetched, displayed, and updated on your screen. Here’s a breakdown of how they work and the differences under the hood: AJAX API Calls AJAX (Asynchronous JavaScript and XML) is the classic technique for API requests. With AJAX, we can fetch or send data without reloading the page, thanks to its asynchronous nature. It often uses: - XMLHttpRequest (XHR) or Fetch API: Initiates HTTP requests to communicate with servers. - Callbacks/Promises: Handle responses once data is retrieved. - jQuery or Vanilla JS: Commonly used for AJAX in legacy projects, though modern apps may use fetch(). How it works: AJAX opens a request, listens for server response, and updates the DOM, ensuring only the required page sections update. React API Calls React, a component-based library, uses its state management to handle API calls, usually with fetch or axios. Calls typically occur in component lifecycle methods like useEffect() or class component lifecycle hooks. - Functional Hooks (useEffect): Allows API calls based on component mounting, updating, or unmounting. - State Management: React’s state system efficiently tracks data changes, which updates the DOM only where necessary. Under the Hood: React re-renders components based on state changes, so it fetches data, stores it in state, and automatically re-renders only the updated UI parts. Angular API Calls Angular, a comprehensive framework, uses a structured approach for API calls via services and HttpClientModule. With Angular, calls often rely on RxJS Observables for: - Reactive Data Streams: Enables complex data flow control like retries, transformations, or error handling. - Dependency Injection: Makes services reusable and easy to manage across the app. Under the Hood: Angular listens for API data changes via Observables, which emit values over time. Components subscribe to these observables to keep the UI in sync with the server responses. Key Differences 1. React & Angular Use Virtual DOM/Data Binding: React’s Virtual DOM re-renders components based on state, while Angular uses two-way data binding with observables. 2. AJAX is Framework-Agnostic: AJAX can work anywhere, but React/Angular’s calls are framework-optimized. 3. React & Angular Manage State Efficiently: React and Angular components manage state within the app, making them more efficient for SPAs than traditional AJAX. While AJAX is the foundation, React and Angular have evolved API call handling with optimized rendering, observables, and structured state. This evolution helps deliver the responsive and efficient experiences we expect from modern applications.

١

Managing assets in a Flutter project becomes cumbersome as the number of app modules grows. My team works on such a project that houses more than 450 assets, mostly PNGs, SVGs, and JSON files spread across nested subdirectories. Whenever one has to add an icon, there's a 50% chance that a similar icon already exists in the system but is hard to spot due to being distributed into different subdirectories. This results in duplication and ends up bloating the app. To solve this, I thought of a simple solution: displaying all the files that exist in the /assets directory and subdirectories of our project. It would be a standalone, lightweight, auto-generated web page that would display the asset files of our project. I initially wrote a simple Dart script that performs all the necessary operations in one command. Later, I converted it into a Dart package, which is now available on pub.dev. Additionally, with size-based sorting, this package can help you analyze which assets are taking up the most space in your project. Don't be surprised if you see some very old and redundant PNGs, which you added 2 years back. Thanks to the outcome of this package, we are now planning to reduce our app size by ~4MB with the next release. You can find the package on pub.dev: https://lnkd.in/gpqJnXXe And if you're like me and interested in the source, you can visit the repo on GitHub: https://lnkd.in/g3JrTxaZ #devtools #flutter #dart #library #flutterpackage

١١٣

٣١ تعليق

Difference between APK (Android Package) and Android App Bundle (AAB) The difference between APK (Android Package) and Android App Bundle (AAB) lies in how they manage the app's resources and how they are used to distribute the app. **APK**: - An APK contains a compiled version of an app, along with critical media resources such as icons and sounds. - It also includes a manifest file, providing app information to the Android system, and a set of certificates and signing keys that verify the publisher's identity. - APKs are installable, executable formats for apps on Android devices. - Historically, APKs contained all the app's resources, which meant that users would download unnecessary resources not specific to their device, leading to larger downloads and increased storage use². **Android App Bundle (AAB)**: - AAB is a publishing format that includes all your app's compiled code and resources, but defers APK generation and signing to Google Play. - Google Play uses the app bundle to generate and serve optimized APKs for each device configuration, meaning only the code and resources needed for a specific device are downloaded to run the app. - Developers no longer need to build, sign, and manage multiple APKs to support different devices, and users benefit from smaller, more optimized downloads. - AABs support dynamic delivery, where feature modules are included with your app based on conditions you specify, or are available for download at runtime using the Play Core Library¹. - From August 2021, new apps are required to publish with the Android App Bundle on Google Play¹. In summary, while APKs are the traditional format for Android apps, AABs offer a more efficient way to distribute apps by ensuring that users only download the parts of the app that are relevant to their specific device, resulting in reduced app sizes and more efficient use of device storage. Source: Conversation with Copilot, 6/12/2024 (1) APK vs App Bundle: Why Is Google Changing Android's App Format?. https://lnkd.in/dtJDHHTi. (2) About Android App Bundles | Android Developers. https://lnkd.in/dxQMgbge. (3) Android App Bundle frequently asked questions. https://lnkd.in/dRuVv8zY. (4) What you need to know about Android App Bundles. https://lnkd.in/dRqFJ_M7.

١٠

🚀 Dartz with Bloc State Management in Flutter – A Clean Architecture Guide 🚀 If you're a Flutter developer looking to improve your app's scalability, maintainability, and performance, check out my latest article where I dive deep into integrating Dartz with Bloc for state management, following the principles of Clean Architecture. Learn how functional programming, immutability, and error handling can transform your Flutter projects for the better. 🙌 🔗 Read it here: Dartz with Bloc State Management in Flutter #Flutter #Dartz #Bloc #StateManagement #CleanArchitecture #AppDevelopment #ParmendraSingh #TechInsights

٣

#copied 🔥 Interview questions for a .NET Core or .NET Core MVC developer 🧑‍💻. 1) What is the difference between an interface and abstraction in object-oriented programming, and in what scenarios should each be used? 2) Can you explain what microservices are in the context of .NET Core and how they differ from traditional monolithic architecture? https://lnkd.in/gahGwj3W 3) What roles do the Startup.cs and Program.cs classes play in a .NET Core application, and how do they work together to configure and run the application? 4) what stage of a web API request process do we typically perform authorization, and what are the common methods for implementing it? 💥 Authorization in Web API: Authorization is typically performed after authentication, during the request handling process. This ensures that the user is verified before checking if they have the rights to access specific resources or perform certain actions. Common methods include token-based authentication (like JWT), OAuth, and role-based access control. 5) Can you explain the SOLID principles in object-oriented programming, and how each principle contributes to writing maintainable and scalable code? 💥. The SOLID principles are five design principles aimed at making software designs more understandable, flexible, and maintainable: 💪 S: Single Responsibility Principle (SRP) – a class should have one reason to change. 💪 O: Open/Closed Principle (OCP) – software entities should be open for extension but closed for modification. 💪 L: Liskov Substitution Principle (LSP) – objects of a superclass should be replaceable with objects of a subclass without affecting functionality. 💪 I: Interface Segregation Principle (ISP) – clients should not be forced to depend on interfaces they do not use. 💪 D: Dependency Inversion Principle (DIP) – high-level modules should not depend on low-level modules; both should depend on abstractions. 6) What are the key differences between a Web API and a REST API, and how do these differences impact their usage in software development? 💥 A Web API is a broader term that encompasses any API accessible via HTTP, including REST, SOAP, and others. A REST API is a specific type of Web API that adheres to REST architectural constraints, such as statelessness, resource-based URLs, and using standard HTTP methods (GET, POST, PUT, DELETE). REST APIs are generally simpler and more lightweight compared to other Web APIs. 🔔 Join me to improve your skills to clean code. 👩‍💻 Please share and repost and help others to code better and clean code. Follow me : Ayyappa Reddy. #efcore #entityframework #csharp #csharpdotnet #csharpdeveloper #csharpprogramming #linq #dotnet #dotnetdeveloper #dotnetcore #dotnetfullstackdeveloper #aspnetcore #aspnet #aspdotnet #aspnetmvc #mvcframework DotNet Openings .

٣

چطور کد بک‌اند خود را در Node.js (با استفاده از Express.js) ساختاردهی کنیم: 📁 ├── 📄 app.js ├── 📁 bin ├── 📁 config ├── 📁 controllers │ ├── 📄 customer.js │ ├── 📄 product.js │ └── ... ├── 📁 middleware │ ├── 📄 auth.js │ ├── 📄 logger.js │ └── ... ├── 📁 models │ ├── 📄 customer.js │ ├── 📄 Product.js │ └── ... ├── 📁 routes │ ├── 📄 api.js │ ├── 📄 auth.js │ └── ... ├── 📁 public │ ├── 📁 css │ ├── 📁 js │ ├── 📁 images │ └── ... ├── 📁 views │ ├── 📄 index.ejs… │ ├── 📄 product.ejs │ └── ... ├── 📁 tests │ ├── 📁 unit │ ├── 📁 integration │ ├── 📁 e2e │ └── ... ├── 📁 utils │ ├── 📄 validation.js │ ├── 📄 helpers.js │ └── ... └── 📁 node_modules

٢

Here the #roadmap for #ReactJS 𝟏.𝐂𝐨𝐦𝐩𝐨𝐧𝐞𝐧𝐭𝐬 • Functional Components • Class Components • JSX (JavaScript XML) Syntax 𝟐.𝐏𝐫𝐨𝐩𝐬 (𝐏𝐫𝐨𝐩𝐞𝐫𝐭𝐢𝐞𝐬) • Passing Props • Default Props • Prop Types 𝟑.𝐒𝐭𝐚𝐭𝐞 • useState Hook • Class Component State • Immutable State 𝟒.𝐋𝐢𝐟𝐞𝐜𝐲𝐜𝐥𝐞 𝐌𝐞𝐭𝐡𝐨𝐝𝐬 (𝐂𝐥𝐚𝐬𝐬 𝐂𝐨𝐦𝐩𝐨𝐧𝐞𝐧𝐭𝐬) • componentDidMount • componentDidUpdate • componentWillUnmount 𝟓.𝐇𝐨𝐨𝐤𝐬 (𝐅𝐮𝐧𝐜𝐭𝐢𝐨𝐧𝐚𝐥 𝐂𝐨𝐦𝐩𝐨𝐧𝐞𝐧𝐭𝐬) • useState • useEffect • useContext • useReducer • useCallback • useMemo • useRef • useImperativeHandle • useLayoutEffect 𝟔.𝐄𝐯𝐞𝐧𝐭 𝐇𝐚𝐧𝐝𝐥𝐢𝐧𝐠 • Handling Events in Functional Components • Handling Events in Class Components 𝟕.𝐂𝐨𝐧𝐝𝐢𝐭𝐢𝐨𝐧𝐚𝐥 𝐑𝐞𝐧𝐝𝐞𝐫𝐢𝐧𝐠 • if Statements • Ternary Operators • Logical && Operator 𝟖.𝐋𝐢𝐬𝐭𝐬 𝐚𝐧𝐝 𝐊𝐞𝐲𝐬 • Rendering Lists • Keys in React Lists 𝟗.𝐂𝐨𝐦𝐩𝐨𝐧𝐞𝐧𝐭 𝐂𝐨𝐦𝐩𝐨𝐬𝐢𝐭𝐢𝐨𝐧 • Reusing Components • Children Props • Composition vs Inheritance 𝟏𝟎.𝐇𝐢𝐠𝐡𝐞𝐫-𝐎𝐫𝐝𝐞𝐫 𝐂𝐨𝐦𝐩𝐨𝐧𝐞𝐧𝐭𝐬 (𝐇𝐎𝐂) • Creating HOCs • Using HOCs for Reusability 𝟏𝟏.𝐑𝐞𝐧𝐝𝐞𝐫 𝐏𝐫𝐨𝐩𝐬 • Using Render Props Pattern 𝟏𝟐.𝐑𝐞𝐚𝐜𝐭 𝐑𝐨𝐮𝐭𝐞𝐫 • <BrowserRouter> • <Route> • <Link> • <Switch> • Route Parameters 𝟏𝟑.𝐍𝐚𝐯𝐢𝐠𝐚𝐭𝐢𝐨𝐧 • useHistory Hook • useLocation Hook 𝐒𝐭𝐚𝐭𝐞 𝐌𝐚𝐧𝐚𝐠𝐞𝐦𝐞𝐧𝐭 𝟏𝟒.𝐂𝐨𝐧𝐭𝐞𝐱𝐭 𝐀𝐏𝐈 • Creating Context • useContext Hook 𝟏𝟓.𝐑𝐞𝐝𝐮𝐱 • Actions • Reducers • Store • connect Function (React-Redux) 𝟏𝟔.𝐅𝐨𝐫𝐦𝐬 • Handling Form Data • Controlled Components • Uncontrolled Components 𝟏𝟕.𝐒𝐢𝐝𝐞 𝐄𝐟𝐟𝐞𝐜𝐭𝐬 • useEffect for Data Fetching • useEffect Cleanup 𝟏𝟖.𝐀𝐉𝐀𝐗 𝐑𝐞𝐪𝐮𝐞𝐬𝐭𝐬 • Fetch API • Axios Library 𝐄𝐫𝐫𝐨𝐫 𝐇𝐚𝐧𝐝𝐥𝐢𝐧𝐠 𝟏𝟗.𝐄𝐫𝐫𝐨𝐫 𝐁𝐨𝐮𝐧𝐝𝐚𝐫𝐢𝐞𝐬 • componentDidCatch (Class Components) • ErrorBoundary Component (Functional Components) 𝟐𝟎.𝐓𝐞𝐬𝐭𝐢𝐧𝐠 • Jest Testing Framework • React Testing Library 𝟐𝟏.𝐎𝐩𝐭𝐢𝐦𝐢𝐳𝐚𝐭𝐢𝐨𝐧 • Memoization • Profiling and Performance Monitoring 𝟐𝟐. 𝐁𝐮𝐢𝐥𝐝 𝐚𝐧𝐝 𝐃𝐞𝐩𝐥𝐨𝐲𝐦𝐞𝐧𝐭 • Create React App (CRA) • Production Builds • Deployment Strategies 𝐅𝐫𝐚𝐦𝐞𝐰𝐨𝐫𝐤𝐬 𝐚𝐧𝐝 𝐋𝐢𝐛𝐫𝐚𝐫𝐢𝐞𝐬 𝟐𝟑.𝐒𝐭𝐲𝐥𝐢𝐧𝐠 𝐋𝐢𝐛𝐫𝐚𝐫𝐢𝐞𝐬 • Styled-components • CSS Modules 𝟐𝟒.𝐒𝐭𝐚𝐭𝐞 𝐌𝐚𝐧𝐚𝐠𝐞𝐦𝐞𝐧𝐭 𝐋𝐢𝐛𝐫𝐚𝐫𝐢𝐞𝐬 • Redux • MobX 𝟐𝟔.𝐑𝐨𝐮𝐭𝐢𝐧𝐠 𝐋𝐢𝐛𝐫𝐚𝐫𝐢𝐞𝐬 • React Router • Reach Router Credit - Shubham Soni Follow Alpna P. for more related content!

٥٤٧

٣٦ تعليق