Josh W Comeau·4yThe Front-End Developer's Guide to the Terminal
Modern front-end frameworks like React, Angular, and Vue rely heavily on the terminal. If you're not comfortable with command line interfaces, you'll struggle to run a local development server or build your application. We don't really need to know 98% of the stuff you can do with a terminal. Instead, we should focus on the most-important critical fundamentals.
LogRocket·4yHow to detect dead code in a frontend project
Using ESLint to detect and remove dead code in your frontend project.Using webpack for dead code detection.Using TypeScript to detect dead code.Detect unused dependencies with depcheck.Using the no-unused-vars rule to detect unused variables in our files.
Bits and Pieces·4y3 Design Patterns Every Developer Should Learn
When numerous algorithms for a given strategy (interface) are required, this pattern comes in handy. Singleton Design Pattern is used when only one instance of a class is required. Observer Design Pattern enables you to set up a subscription mechanism that permits other entities to be alerted of each occurrence on the entity to which you are subscribed.
Hashnode·4yI Design, You Build! - Frontend Challenge #4 (Supabase version)
This is the first prizes giveaway for "I Design, You Build" series. There will be AWESOME SWAG prizes to rewards 5 winners that has the best submission (I will be the judge) The judging period will be 1 month time from the today! Dateline for submission will be 7 May 2022.
Product Hunt·4yDevDum! - 200+ resources for web developers, it's a no brainer
DevDum! contains all the resources needed to learn full stack web development. Get access to video tutorials, sample projects, code examples, and so much more. Less searching more learning with 200+ resources for web developers. It's a no brainer! The DevDum app is free to download and use.
Pointer·4ylouislam/uptime-kuma: A fancy self-hosted monitoring tool
Uptime Kuma is a self-hosted monitoring tool. It is available on GitHub. The server is located in Tokyo, so if you live far from there, it may affect your experience. You can get notifications via Telegram, Discord, Gotify, Slack, Pushover, Email (SMTP)
asayer·4yBuilding a Progressive Web App with React 18
A Progressive Web App is a website that can behave like a native app. When “downloaded” into the user’s device, these websites have almost the same features a native mobile app would. Some features a PWA is capable of include push notifications, the ability to work on Android and IOS without much difference.
Hashnode·4yNew in Node.js v18
Node.js v18 was released yesterday as the current stable version. Here's a quick walkthrough of some of the new features.Node.js now has a built-in testing framework, accesible at import('node:test') Users can now build Node.JS with custom V8 startup snapshots to increase performance.
AppSignal·4yNode.js 18 Release: What's New
Node.js 18 has some significant new features that Node developers should be aware of. The upgrade of the V8 engine to version 10.1 and experimental support for browser APIs like fetch and Streams are among the highlights. The built-in test runner supports subtests, test skipping, limited test runs, and callback tests.
freeCodeCamp·4yReact + WebSockets Project – Build a Real-Time Order Book Application
In this tutorial, we will see how to build an Order Book web application. We'll use React with Typescript for creating the UI, Redux for managing the application state, and styled-components for applying the styling. And last, but not least, we'll use WebSockets for fetching the data feeds.
Telerik·4yTop Frontend Developer Tools for Beginners in 2022
Frontend development is the process of designing and building applications that run on the web using web technologies such as HTML, CSS and JavaScript. In this post, we will take a look at a few tools that frontend developers cannot do without in 2022 and what I love about them. If you are a developer or looking to become one, this is a good piece to get started.
Codrops·4yCase Study: Windland — An Immersive Three.js Experience
Three.js is an open-source, free-to-use programming language. It can be used to create interactive games, such as SimCity. In this article we’ll look at the creation of a mini-city full of post effects and micro-interactions using Three.js.
Changelog·4ygoogle/wireit: Wireit upgrades your npm scripts to make them smarter and more efficient.
Wireit is alpha software in early development but early development. It can be used to run scripts in parallel and to cache output. Wireit upgrades your scripts to make them smarter and more efficient. It works with single packages, monorepos, yarn and pnpm. It's free and available on GitHub for free.
gitconnected·4y3 Web Observers Every Web Developer Should Know
The MutationObserver interface can monitor changes in the DOM tree and is part of the DOM3 event specification. ResizeObserver reports changes to the dimensions of an Element’s content or border-box, or the bounding box of an SVGElement. PerformanceObserver and ReportingObserver are used to monitor performance measurement events.
Pointer·4ywithfig/autocomplete: Fig adds autocomplete to your terminal.
Fig adds autocomplete to your terminal. As you type, Fig pops up subcommands, options, and contextually relevant arguments in your existing terminal on macOS. Use the steps below or follow our getting started guide: fig.io/docs.Download Fig for macOS and NPM (or Yarn).
Supabase·4ySupabase Realtime, with Multiplayer Features
Today is Supabase Realtime Day, where we announce and demo the next version of Realtime. The next and third major version introduces multi-tenancy to listen to many databases. This new version introduces a distributed cluster of nodes, which introduces better resource utilization, fault-tolerance, and lower latencies.
Hashnode·4yGetting started with Web 3.0 for Frontend Engineer
Web 3.0 is the third generation of internet services for websites and applications. It will focus on using a machine-based understanding of data to provide a data-driven and Semantic Web. It is a read-write-interact web (powered by artificial intelligence) that runs on the blockchain.
Robin Wieruch·4yReact Hook: useLocalStorage
A neat custom React Hook that shows how to use local storage in React to store state. You can just use it in any React component and it allows you to write and read state. The hook is only there as a learning experience though. If you rely on the local storage for your React application in production, you should check out more widely used hooks.
DevDojo·4yReactJS Virtual DOM and Reconciliation - Explain Like I'm Five
ReactJS is a web app that uses the DOM (Document Object Model) to create web pages. DOM is represented as a tree structure document object that can be queried and updated. A new Virtual DOM tree is created whenever the element's state changes. Virtual DOM is created as a copy of the original DOM.
Hashnode·4yUI Design Principles
User Interface is the point of interaction between the user and our application or product. Principles of UI designs give us a foundation for a chain of reasoning when designing new interfaces, modifying or redesigning old interfaces. It gives us a guideline so we don’t fall out of place during the designing process.
Honeypot·4yJavaScript Array.forEach() In The Real World
In this article, we will take the example established in the previous articles and show how forEach() can help us. We will take a deep look at how the method works, why we need it, and what it would look like in a typical modern front-end codebase. We are working on the codebase of an online shop I created. You can check out the web app and see our examples in action.
Medium·4yStack & Tools You Should Learn to Become a Full-Stack Developer Faster
Single Page Applications (SPAs) are the way to go. Vue.Js is one of the most popular SPA-building libraries. Node.js is a JavaScript runtime environment that is open-source and cross-platform. MongoDB is the “M” in the famous MEAN and MERN stacks.
LogRocket·4yChoosing the best Next.js hosting platform
Vercel, Netlify, and Heroku are all possible hosting solutions for Next.js projects. Vercel offers a few neat features for frontend developers, including Preview Mode. Heroku is a cloud-based hosting platform that lets developers build and test apps on the fly.