Alex Erdei

Stop using CSS preprocessor! CSS nesting is now natively supported. If you were using a preprocessor only for this feature, It might be time to go back to plain CSS. (Otherwise you can stick with it). 1/ No build tools required - It makes the development setup easier. - It also reduces the project’s build time. 2/ Reduced file size - Sass expands rules during compilation, increasing the final CSS size. - CSS nesting doesn't expand rules, resulting in smaller CSS. Browser support is already strong at 91.3%. But keep in mind that unsupported browsers will fail to parse nested rules. If you need full compatibility, consider using a build step until support is universal. If nesting was the only thing keeping you tied to a preprocessor… maybe it’s time to go vanilla. Have you started using native nesting yet? Curious to hear how you're approaching it 👇 PS: I’m working on an ebook called “You Don’t Need JavaScript”. To get notified when it launches 👉 https://lnkd.in/eytryeaj

690

63 Comments

🚨 Important Update for React Native Developers With the release of React Native 0.82, the legacy architecture is being officially deprecated. From this version onward, the new architecture will be enabled by default and there will no longer be an option to disable it. This marks a significant step forward in performance, reliability, and future-proofing your apps. 🔗 GitHub link is provided in the comments section. #ReactNative #MobileDevelopment #Expo #React #Architecture #App #Development #JS #NewArchitecture #OpenSource #Apps #CrossPlatform #JavaScript #Tech #Update

251

10 Comments

💡React/Next.js Tip💡 To store and access Form Data in React, you don't always need to declare state. If you're not using the data entered in the form to pass to any other component, Then you can use the JavaScript FormData API to access the data. This avoids extra re-rendering of your component as we don't declare any state in the component, and it's a common practice to use the FormData API when working with React/Next.js. 𝗙𝗼𝗿 𝗺𝗼𝗿𝗲 𝘀𝘂𝗰𝗵 𝘂𝘀𝗲𝗳𝘂𝗹 𝗰𝗼𝗻𝘁𝗲𝗻𝘁, 𝗱𝗼𝗻'𝘁 𝗳𝗼𝗿𝗴𝗲𝘁 𝘁𝗼 𝗳𝗼𝗹𝗹𝗼𝘄 𝗺𝗲. #javascript #reactjs #nextjs #webdevelopment

100

16 Comments

Did you know you can see an overview of your page's CSS inside the browser devtools 💡 This can help you identify unused CSS declarations, weird font-sizes or font-families, overusage of media queries, selector types, and more ✅ So how do you reach it? Open your devtools (f12), can press ctrl + shift + p (cmd + shift + p on a Mac), search for show CSS overview and select it, this will add a new tab in your devtools 🪄

94

5 Comments

Do you know about the appearance: none; property in CSS? Let me explain! Form elements like <input>, <textarea>, and elements like <img> are replaced elements. This means the browser (or operating system) replaces them with something else. For example, an <img> is replaced by its src image, and form elements are styled by the operating system. That’s why form elements look different across operating systems and browsers. One key detail about replaced elements is that they don’t support pseudo-elements like ::before and ::after, because these elements are removed once the replacement happens. But here’s where appearance: none; comes to the rescue! This property essentially tells the browser: “Don’t replace this element, I’ll handle the styling myself.” By doing this, you get full control over the element’s design and even better, you get back the ability to use pseudo-elements (before, after)! Where is this helpful? One practical example is customizing checkboxes. You can turn a simple checkbox into a toggle switch without using JavaScript. • Use the input as the “track” of the switch. • Use the ::before pseudo-element as the “thumb.” • With the :checked state, you can move the thumb from one side to the other. This lets you create a fully functional switch with just CSS! #css #cssTip

107

11 Comments

🚀 React Developer Roadmap – From Zero to Advanced If you’ve ever wondered “What’s the right path to learn React?” — this roadmap nails it. It breaks React into 3 clear stages: 🔹 Fundamentals – the core building blocks (JSX, Components, Props vs State, Hooks). 🔹 Advanced – deeper concepts (Context, Refs, Error Boundaries, Fiber). 🔹 Ecosystem – the real-world tools (Routing, API calls, State Management, Testing, Styling). Here’s the thing → most beginners jump straight into libraries like Redux or Material UI without truly understanding React fundamentals. But once you master the basics, everything else clicks naturally. 💡 My tip: Don’t try to learn everything at once. Pick a project, move step by step through this roadmap, and apply each concept in code. That’s where the learning sticks. 👉 Over to you: If you’re learning React, where are you right now on this roadmap — Fundamentals, Advanced, or Ecosystem? #ReactJS #WebDevelopment #JavaScript #Frontend #Coding

326

4 Comments