react

6 Tips: Using Next.Js For Your Next Web App

Next.js is indispensable when you want to build a high performance React app. It’s being used to po...

Search Autocomplete For 2 Million Records With React & Aws Cloudsearch

True Home is a bootstrapped web app that provides a home value estimate for every property in Hong Ko...

Forms Are Hard

TLDR; Need forms in your app? There are many options. Our journey to ShapeForm! It’s no secret t...

Proton-Native Vs Vuido Vs Nodegui

Image by LUM3N from Pixabay Last year we welcome a new library to make UI components using native wi...

Let's Take A Look At Css In Js With React In 2019 - Css & Inline Styling

Let's Take a Look at CSS in JS with React in 2019 - CSS & Inline Styling CSS in JS isn...

Using Gatsby With Agility Cms

Gatsby is an amazing framework for Static Site Generation. Built on top of React.js, it's been aroun...

Make Crud Simple With Node, Graphql, And React

Written by Avanthika Meenakshi✏️ GraphQL reduces the complexity of building APIs by abstracting all...

Learn The Vanilla And Flavouring Pattern

Originally written by Uri Kutner on "Bits and Pieces" Can you write code that is both reusa...

So I Built A Free Online Api Builder With Cors Support 🚀 (And Why Another Postman Alternative)

TL;DR Use getd.io/ to test APIs with only your browser - No app or plug-in needed. Support...

Move Over Redux: Apollo-Client As A State Management Solution (With Hooks 🎉)

Background On the Internal Tools team at Circle, we recently modernized a legacy PHP app b...

Object.Fromentries (Es2019) - An Elegant Inverse Of Object.Entries (Es2017)

Hey! 👋 Check out today's Dev Tip! 👇 Follow me on Twitter @shahzaibkhalid for more Dev Tips! ✨...

Render A List From An Object In React

image from undraw.co Sometimes the data we want to render in a list will be in an object rather than...

Now Use Material-Ui Icons With Super Ease

Instead of searching for icons in Material icons, and then trying to figure out what the required ico...

How To Setup Eslint And Prettier For Your React Apps

Building high-quality apps is challenging for many reasons: The more your codebase grows, the more...

How To Use Midi For Web In Short

MIDI player Use MIDI parser to read notes from MIDI file Use WebAudioFont to play musical instrumen...

Talk Tv Tutorial: Watch Youtube Streams And Chat With React

In this tutorial I'm going to show you how to bootstrap a React project from scratch using NPM and Webpack, integrate Google Login, grab data from the Youtube API, and deploy your code to Netlify

Build A "Not Hotdog" Clone With React Native

Learn Image classification with Google's Vision API

Render Props Are Still Useful

The render props pattern has been a popular way to share logic between components. Since React 16.8 custom hooks are a more elegant way of sharing logic between components. So, no need for render props now then? No! Render props are still useful for building reusable components ...

Build A React & Firebase Blog Site: Part 2

Build a React & Firebase Blog Site: Part 2

Building A Movie App With React Hooks And Cloudflare Workers

This is a tutorial on how to use React Hooks to build the UI for a movie app and Cloudflare Workers (serverless or cloud functions) for the proxy API.

Next.Js File Structure

Overview of the file structure I like to use in Next.js projects

Mini React Tactics - Reactdom

Typically, this is the code in the index.js document. import ReactDOM from 'react-dom'; // ... cod...

Introducing Quick Notes

Deploy a full stack web app with AWS Amplify to help you organize your notes when you're on the go.

Creating A Full-Stack Mern App Using Jwt Authentication: Part 2

Written by Praveen Kumar✏️ So far, we have covered the core functionality of JWT authentication in...

Object Detection Using Tensorflow.Js

A new article is published on overflowjs.com around detecting an object in an image using tensorflow....

A Problem Only Gatsby Could Solve?

A little while ago I set out to create a site that collated tutorials and articles about...

High Order Component (Hoc) In React. What & Why?

Till the date whether you are an experienced developer or a beginner, you must know the paramount rul...

Ulearn - Lms Script Built On Laravel 5.8 And React Js 16.9

ULEARN is an application similar to UDEMY with all the basic features that needed for Learning Manage...

What Hides Under Jsx

Simple fast explanation of JSX

What Is Graphql (Part 1)?

In this blog we discuss on what is GraphQL, how it works and watch an awesome documentary 😀

How I Deployed My React-On-Rails App To Heroku

A space odyssey …. I just graduated from the Flatiron School, and I’m pretty h...

Rails Api Project Part 3: Adding A Front End With React & Redux

and how to call the custom sorting methods we created on the back end. In the ...

Gerando Número Aleatório

Com essa função você pode facilmente gerar um numero aleatório inteiro com JavaScript, passando com...

Runtime Configurations With React

Hot Module Reloading With Next.Js Docker Development Environment In 4 Steps

This post will go through how to add hot module reloading to Next.js running a docker environment. Th...

Build A Progressive Web App In Docker With Nginx To Deploy To Kubernetes Or Docker Swarm

An updated version of this article with current examples is available at...

React Testing With Airbnb's Enzyme, Jest And Babel

Hi Guys Good Day! ok, guys first We gonna configure Jest, Enzyme from the ground up. So yo...

Error When Serving React App From Sub-Folder

Hello there! I'm trying to serve a React application from a sub-folder. It's currently a very simple...

How To Fade In Content As It Scrolls Into View

Want to make your content fade in as it scrolls into view? This article will give you the how-to!

I’Ve Completely Rewritten Two Projects With React Hooks, Here Is The Good And The Ugly

The Article: https://medium.com/@unbug/ive-completely-rewritten-two-projects-with-react-hooks-here-...

React Native Cookbook — Free Concise Video Tutorial

Article: https://medium.com/@unbug/react-native-cookbook-concise-free-video-tutorial-f53b9c84216 Gi...

Build A React & Firebase Blog Site: Part 1

Build a React & Firebase Blog Site: Part 1

Globalthis - Access Environment-Agnostic Global `This` Value

Hey! 👋 Check out today's Dev Tip! 👇 Follow me on Twitter @shahzaibkhalid for more Dev Tips! ✨ gl...

Compute Values On Component Mount With React Hooks: State Vs Ref

I recently came across this question: I have a functional React component that computes a value whe...

Thinking In React Hooks

if you haven't already, please read the official docs on React Hooks. What I present here is my take...

Minimal List Drag And Drop Library, Should I Re-Implement To Be A Custom Hook?

Hi I recently made this small library for making any list of React components to be draggable with mi...

Self Hosted Gitlab Continuous Deployment To Netlify

If you haven't yet checkout out Netlify, you definitely should! While Netlify has direct integration...

Validando Email Com Regex

Com a quantidade de top-level domains hoje em dia, fica difícil validar emails. Usando RegEx (Regul...

Componentwillunmount Call Webservice

Hello friends, I have a question to ask. In the "componentWillUnmount" method, is it possible to inv...

Can You Replace Redux With React Hooks?

This was originally published on chrisachard.com Hooks are gaining popularity as a way to add state...

React Reverse Portals

New React library to help with performance & simpler state management

An Infinite Loading List Component In React

Photo by Jaël Vallée on Unsplash Hi 👋, Last week I wrote an article about creating an infinite load...

Isomorphic Javascript: What Is It And What Can I Do With It?

Isomorphic JavaScript: What is it and what can I do with it? JavaScript, a language...

The Battle Of Apples And Oranges: Angular Vs React Vs Vuejs

The battle of apples and oranges: Angular vs React vs VueJS People keep asking about...

Frontend Weekly Digest (19–25 August 2019)

Web-development • amp-script: AMP JS • What HTML6 really needs (Living standard) • Optiona...

React Spring Vs Animated

Written by Peter Ekene Eze✏️ The Animated library is designed to make animations fluid, powerful,...

Introducing Journey - An App For Tracking Job Listings

Deploy a full stack web app to help you organize your job search in minutes with React and AWS Amplify.

8 Miraculous Ways To Bolster Your React Apps

Find me on medium Sometimes when we build our apps in React we can easily miss opportunities to impr...

Reactgate Recap

Series of Events A take on Vue developers vs. React developers is tweeted....

React Run Error (Solution)

The react files I created recently stopped working. I've done a lot of research and finally I have a...

Making A Gatsby Site From Meetup Event Data

As part of my talk preperation for Aalborg Frontend Meetup, I was going to do a walkthrough of a new...

Why React Hooks (Part I: Complicated Lifecycles)

Prerequisite: Basic knowledge about React In this post, we are going to talk about one in million re...

A Brief Intro To Rxjs

From promises to observables.

If I Say "React"... Then What Comes In Your Mind? :\

A post by Noman Gul

Promise.All (Es2015) Vs Promise.Allsettled (Es2020). What's Changed? 🤔

Hey! 👋 Check out today's ⚡️ Dev Tip 💡 👇 Follow me on Twitter @shahzaibkhalid for more Dev Tips! ✨...

Custom React Navigation Transition | Implementation And Demo

In this tutorial, we are going to learn how to customize React Navigation transition. If you are just...

Make A Custom Night Mode Toggle W/React & Css Variables

This post is the first in a short series where I will detail the things I learned while designing and...

React Sticky Event With Intersection Observer

Photo by Kelly Sikkema on Unsplash There isn’t a way to monitor stickiness of a component in CSS (po...

Adding A Dynamic Sitemap.Xml To A Next.Js Site

While building my blog with Next.js I naturally wanted to support sitemaps because it can supposedly...

Typescript. Simple React Components.

How to write components with friendly interface, but also with strict typings.

Custom Gatsby.Js Source Plugin

We take a deep dive into how data and GraphQL works with Gatsby.js, and also create our own data nodes for Gatsby using an external API.