Medium·4yFantastic CSS border animation
In this article we will use CSS to create a variety of wonderful border effects. The most commonly used one is solid , dashed which appears in the picture above dashed. CSS border also supports none , hidden , dotted , double , groove , ridge , inset , and outset other styles.
Medium·3ySay bye bye to bad javascript practices
Some small practices in programming can have a continuously negative impact on the code we write and the product we create as the end result. It’s important to share what they are and why you should avoid them at all costs. Here are a few tips and reminders to help you write code comments like a pro.
Medium·4yLodash is dead. Long live Radash.
Lodash was created in 2009 (as Underscore) and rose to power after a fork (as Lodash) around 2012-2013. The language was too unsafe, unmaintainable, and unwieldy. The addition of optional chaining and null coalescing alone makes a large handful of Lodash functions obsolete. The source code is maintained with understandability for newcomers as a top priority.
Medium·4y6 Best Practices for Software Delivery
The Testing Pyramid is a great starting point, and the Testing Pyramid to Fail Fast and Reduce Risk. The longer you leave feedback, the most costly it will become, you start having to interrupt people from other work, and after weeks/months pass by, it’s more likely that people and knowledge will leave.
Medium·3yReact JS Best Practices
The React style guide is a set of recommendations for writing clean, maintainable code with React. Hooks are a new feature in React that allow you to use state and other React features without writing a class. The React memo higher-order component is a way to optimize the performance of your functional components.
Medium·4y11 Advanced React Interview Questions you should absolutely know (with detailed answers)
React is a tool that allows you to add and remove elements from the DOM. It can be used to make changes to the DOM without having to change the entire DOM. The tool can also be used in conjunction with other tools to make it easier for people to create and edit new elements.
Medium·4yBun (can become) the ideal JavaScript runtime
Bun is the first project of its kind that really listens to criticism. The project is experimental, and will require time and effort to mature, but it already shows some incredible potential. It’s the best of both worlds. To be able to write business logic in simple script, yet have the platform it runs on perform close to native.
Medium·4yAutomatic Dark Mode With JavaScript
Detecting Users’ OS Dark Mode Preference Using matchMedia() using JavaScript. For many users, dark mode provides a more eye-friendly interface with fewer white tones that can cause eyestrain. In JavaScript, you can takes advantage of the Window interface’s match media() method to check the value of the prefers-color-scheme CSS feature.
Medium·4yAll in one! Javascript promises…
Javascript promises (“Can be Fulfilled | Rejected”) can be considered as the asynchronous counter part of a getter function. Javascript is a single threaded & Only one thing can happen at a time, on a single main thread. To avoid promise chaining and to write clean code, we have async & await. Async Await acts as syntactic sugar on top of promises, making asynchronous code easier to write and read.
Medium·3yHandling errors like a pro in TypeScript
The correct answer is to narrow the type of error, and we’ll look at how to do that, but why is this even necessary? In JavaScript, just about anything can be thrown: The error that is caught truly is unknown. When the error is caught we can narrow the error type by using Once narrowed, gives us intellisense.
Medium·3yAs a Front-End Engineer: 8 Useful Npm Coding Techniques That You Should Use
Npm can help you achieve this goal quickly. You only need to run to quickly open's documents 2.# Open a package’s documentation page My friends, it would have saved me a lot of time if I had known this trick earlier.
Medium·4yWhy does JavaScript’s parseInt(0.0000005) print “5”?
The parseInt(string, radix) function parses a string argument and returns an integer of the specified radix (the base in mathematical numeral systems) The first step is to convert the number to string and the second step is the rounding operation. The answer will return 5 only because it is the only character that is a number till a noncharacter e, so the rest of it e-7 is discarded.
Medium·4yA guide to React 18 hooks
React 18 Hooks are the new patterns that got introduced in React 16.8 version. Hooks were introduced in class components but this time in the functional components. These Hooks Apis could help us interact with the React local states, the lifecycle features and many more things.
Medium·4yYou’re not lazy. You’re doing the wrong thing.
The number of ‘imposter syndrome’ articles is astronomical, but you’re not an imposter. So, what’s standing between you and the things you want in your career? Focusing on the right priorities. For each person, the right things will be different.
Medium·4yThe Ultimate Clean Architecture Template for TypeScript Projects
The Ultimate Clean Architecture Template for TypeScript Projects. A guide on creating a layer-based TypeScript project template following the principles of clean architecture. A Detailed Implementation Guide Create your project directories and root Configuring Core, Data, and DI Setting up the mono repo configuration.
Medium·3yWhy You Should Use Islands Architecture
In 2013, the Facebook-backed React barreled onto the web development scene offering a completely new way of rendering web applications. Instead of rendering pages on the server and shipping them to the client, developers could use React to create Single Page Applications (SPAs) that were rendered on the client side.
Medium·3yData Fetching: FETCH API Approach vs SWR Approach
Fetching is a method of receiving and sending data provided to us by JavaScript. The Fetch API method has an asynchronous nature. It is not a method that can be used alone as a substitute for FETCH API. In the Single Page Application method, there is usually no need to load a web page from scratch.
Medium·4yJavascript Interface(JSI): Overview and the need for re-architecture of react native
React Native is bundled with cross platform support, OTA updates, live reload, cost efficiency and cost efficiency. The biggest bottleneck in scaling react native applications has been the performance as you add more modules. But how the current architecture works? React Native architecture depends on three threads: a) UI thread.
Medium·4yHow we reduced our annual server costs by 80% — from $1M to $200k — by moving away from AWS
Prerender saved $800k by removing their reliance on AWS and building in-house infrastructure Combined with AWS, we had already cut our expenses by 22%. The testing phase was crucial to make sure the following processes would run smoothly. After testing whether Prerender pages could be cached in both S3 and minio, we slowly diverted traffic away from AWS S 3 and towards minio.
Medium·4yBasic JavaScript — JavaScript for Beginners — Part 1
The default value of variables that do not have any value is undefined. A variable name cannot be a reserved keyword in JavaScript, e.g. var, function, return cannot be variable names. Variables declared inside a { } block can be accessed from outside the block. The const the keyword was introduced in ES6 (2015). Variables defined const cannot be Redeclared.