Blog

Build a Custom Time Slider Component with Ant Design and Next.js

With the right building blocks, even complex UI components don't require weeks of effort to achieve.

Automatically Publish a Repo as a PyPI Library with GitHub Actions

Just a config file, a few Python scripts, and a GitHub Actions workflow make publishing to PyPI effortless.

Animate an Auto-Scrolling Carousel with Only HTML and CSS

No libraries, no JavaScript, just CSS keyframes and the scroll snap module.

Lean on CSS Clip Path to Make Cool Shapes in the DOM without Images

Hearts, stars, and horseshoes - or maybe just a jaunty polygon for extra flair.

Introducing Notehub Py - the Python SDK for Notehub

Notehub Py helps you with the Notehub API, interacting with data in a Python-friendly manner.

Create a Custom Formatted CSV from Python Data

The DictWriter package makes creating a CSV file from a Python list simple.

Filter, Merge, and Update Python Lists Based on Object Attributes

Manipulating lists of items by object attributes is surprisingly tricky.

Use Selenium with Python to Target the XPath of a Particular Object

Extract data from each item in a list of items instead of the whole webpage.

Scrape Data from a Lazy Loading Website with Selenium Python

No API to fetch data? No problem when you can build your own web scraper.

Copy Files from One Repo to Another Automatically with GitHub Actions

Even add a newly copied file to a feature branch for easier pull request reviews.

Automatically Create a Pull Request Against a Feature Branch with GitHub Actions

Keep up with code reviews programmatically using workflows.

Use GitHub Actions to Automatically Publish a Repo Subfolder as an npm Library

Publish a project subfolder to npm with just a package.json and a GitHub Actions workflow.

Tips and Tricks for Using the Prisma ORM

Implicit relational databases, JSON values, fetching the latest record from a table, handling no data scenarios - it's all doable with Prisma.io.

Introducing Notehub JS – the JavaScript Library for the Notehub API

Notehub JS connects you to the Notehub API, allowing you to interact with Notehub.io in a JavaScript-friendly way.

Use CSS to Reveal a Child Element in the DOM by Interacting with the Parent

When you want to trigger a change in a nested component, just move the :hover higher.

Create Upsert Yourself for Amazon Redshift Databases

With a separate staging table, inserting and updating data in PostgreSQL is straightforward.

Host-free Smart Parking Lot Help Request Device

Use cellular IoT to alert parking lot attendants when customers need assistance with an SMS message of their current location.

Rely on JavaScript's Intersection Observer to Execute Code When in View (or Not)

Stop a video playing or animate an element onscreen - the Intersection Observer API is highly versatile.

Refrigerator Fleet Monitoring Made Easy with LoRa

Monitor temp, humidity, and door open/close state across fleets of refrigerators with LoRa-based sensors.

Quickly Build Custom IoT Dashboards with Snowflake, Streamlit, and Blues

Some basic Python code can create beautiful, highly customized IoT data visualizations in no time.

Change SVG Color with Help from CSS Filter

We no longer need to bother designers when the SVG's color is slightly off: just filter it.

Render Multiple Colored Lines on a React Map with Polylines

Need more than one color of line in a React Leaflet map? Polylines is the solution.

Build an IoT Smart Leak Detector with SMS Alerts

Learn to build a low-cost, cellular-enabled water leak detection device complete with SMS alerts.

Leave the Water Running? Build an IoT Smart Leak Detector

Build a leak detector complete with SMS notifications if a leak's detected.

Use Secret Environment Variables in GitHub Actions

Setting up protected environment variables for GitHub Actions CI/CD workflows isn't so tough.

Merge JavaScript Objects in an Array with Different Defined Properties

Array.reduce() is the solution to combine objects that share a key, but not necessarily properties.

Use CSS Grid to Make a Fixed Sidebar with Scrollable Main Body

Forget position: absolute and position: fixed , reach for CSS Grid instead.

Anti-Theft GPS Tracker and Recovery System

Build a Notecard-based anti-theft device with SMS alerts when movement is detected.

Customize and Style Complex Data in React Table

Sometimes table columns and cells need data from multiple object properties.

Build and Custom Style Recharts Data Charts

Recharts has standard charts and tooltips, but customizing them takes extra effort.

Blues, Where's My Car?

Sounds the (silent) alarm: anti-theft alerting & asset recovery with a Blues Notecard.

Low Fi LoJack® with Blues and React

Build your own asset tracker from hardware to software and everything in between.

How to Unit Test Next.js API Routes with TypeScript

If you need env vars, mocked data, and TypeScript types, this one's for you.

Create an Asset Tracker with Next.js and React Leaflet

Incremental static regeneration makes updating static pages easy.

Build a Gatsby Blog Post Filter

Even with multiple data sources and things to filter by, it can be done.

Blues - Just Like React, but for IoT

You can build without React or Blues, but why would you?

Cypress Studio - the underrated feature speeding up e2e testing

The feature dramatically cutting down the time it takes to write end-to-end tests.

Introducing Volta - it manages your Node.js versions so you don't have to

With Volta, the old saying of "It works on my machine..." will become a thing of the past.

Low Code GPS Asset Tracker and Map Display

Build a GPS tracker with a Blues Notecarrier, and map it with Datacake.

Using React Hooks to Recognize & Respond to Current Viewport Size

Because Edge Cases are the Only Certainty in Development

Animate a Mobile Hamburger Bar Menu Using CSS and Just a Hint of JavaScript

Add those extra little touches, and propel a site from working to wow.

How to Utilize Submodules within Git Repos

One Solution When the Primary Code Can be Open Source, but Specific Content Needs to be Private

Successfully Throwing Async Errors with the Jest Testing Library

The One Time Errors Should Happen in your Code

CSS Clamp(): The Responsive Combination We've All Been Waiting For

Bringing together the best of CSS min() and CSS max() functions

Setting up Axios Interceptors for all HTTP call in an application

Automatically intercept all the requests and responses so you don't have to remember to do it yourself.

Pure CSS to Make a Button "Shine" and Gently Change Colors Over Time

Because animations and gradients in CSS are delightful.

VS Code's REST Client Plugin is All You Need to Make API Calls

Why leave the IDE to test new endpoints? Now you don't have to.

Recent Advances and Improvements to JavaScript Promises

They've come a long way since the days of Promise.resolve() and Promise.reject()

Mocking HTTP Calls in Cypress End-to-End Tests

Don't let unreliable test data keep your new features from making it to production

Gatsby: Fetching Data at The Component Level with useStaticQuery

Queries are no longer relegated to just page level components

Building a Universal Higher-Order Component Page Loader for your React App

Loading screens are needed everywhere - don't reinvent the wheel every time.

Polling in React using the useInterval Custom Hook

useInterval is a custom Hook that's certain to make intervals simpler in your app.

Animating React with React Transition Group

Another handy React animation library to have in your tool belt.

9 React Testing Library Tips and Tricks

Writing tests is hard. These tips make it a little easier

How to Use React's Context API and useContext() Hooks Effectively

Avoid prop drilling both your values and your functions with the help of Context

JavaScript's Optional Chaining Proposal

Kiss undefined errors that stop you dead in your tracks goodbye

React Socks and Responsive Web Design with React

A React-specific way to build webpages and apps to suit your users device size

Pure CSS Media Queries and Responsive Web Design with React

Build your webpages and apps to suit you user's device size

JavaScript Error Handling from Express.js to React

Because errors are bound to happen and we need to handle them correctly.

How to Pass Multiple Route Parameters in a React URL Path

Redirects are common. Passing more than one piece of dynamic data with them is not.

Destructuring Arrays & Objects: JavaScript ES6 Feature Series (Pt 10)

For concise variable syntax, curly braces have never been more critical

Object Keys, Values, and Entries: JavaScript ES6 Feature Series (Pt 9)

Finally, ECMAScript has introduced some much-needed object manipulation methods

Classes and Inheritance: JavaScript ES6 Feature Series (Pt 8)

Prototypes are still there... under the hood

Built-in Module Imports and Exports: JavaScript ES6 Feature Series (Pt 7)

Import means never having to write "require" again

Enhanced Object Literal Value Shorthand: JavaScript ES6 Feature Series (Pt 6)

Because typing the same thing twice in an object is crazy.

String Template Literals: JavaScript ES6 Feature Series (Pt 5)

Why developers need to know where the backticks key is.

Spread & Rest Parameters: JavaScript ES6 Feature Series (Pt 4)

The syntax so nice ES6 used it twice.

Default Function Parameter Values: JavaScript ES6 Feature Series (Pt 3)

Less parameter undefined checks make developers' lives easier

Arrow Functions: JavaScript ES6 Feature Series (Pt 2)

When is a function not a function? When it's an arrow.

Var, Let & Const: JavaScript ES6 Feature Series (Pt 1)

Let's begin at the beginning...

Node.js 12: The future of server-side JavaScript

Node, new and improved in so many ways

JavaScript International Methods

Because date formatting is pain & international formatting is impossible

Viewport Units, the CSS You Didn't Know About But Should

Because CSS done right is awesome

Github Templates: The Smarter Way to Formalize PRs Among Dev Teams

No more confusing pull requests.

Use ES6 To Destructure Deeply Nested Objects in JavaScript

Because Airbnb's ESLint is merciless in React.

JavaScript's Async / Await versus Promises: The Great Debate

Prepare yourselves, you're stepping into a minefield

4 Solutions to Run Multiple Node.js or npm Commands Simultaneously

At some point, everyone has this problem...

Take Your VS Code Config Anywhere Easily with Settings Sync

Just when you thought Visual Studio Code couldn't get any better, it did.

Node Engines: Helping Developers Everywhere Avoid Phantom Bugs

Specific Node.js engines should be required for every package.json.

Update Feature Toggles in a React App without Redeploying

Spring Cloud makes feature toggles easy. A Node endpoint makes app redeployment unnecessary.

nvm, the Easiest Way to Switch Node Environments on Your Machine in a Flash

Nope, I didn’t misspell npm — Node Version Manager is its own handy dev tool.

How ESLint Makes Me a Better React Developer

JavaScript's loose standards are a blessing and a curse.

Migrating from AngularJS to React

What to Keep in Mind as You Upgrade Your Legacy UI Code Bases

The Case for Standardized Error Handling in Your Web Application’s APIs

Because bad error messages — or worse, errors invisible to users do no one any favors.

Setting Up Swagger to API Test In a JavaScript Application

Spring Boot makes Swagger APIs look easy, Node.js not so much.

Using Java to Read Really, Really Large Files

This is the kind of stuff Java was made for.

Keep Code Consistent Across Developers The Easy Way — With Prettier & ESLint

Writing code is tough enough, don’t make it tougher with bad formatting.

Getting Started with Puppeteer & Headless Chrome for End-to-End Testing

And a brief primer on integrating Puppeteer into Jest testing.

Password Reset Emails In Your React App Made Easy with Nodemailer

Resetting passwords in JavaScript apps doesn’t have to be complicated.

The Absolute Easiest Way to Debug Node.js - with VS Code

Let’s face it…debugging Node.js is (and always has been) kind of a pain.

Streams For the Win: A Performance Comparison of Node.js Methods for Reading Large Datasets (Pt 2)

How readFile(), createReadStream() and event-stream stack up.

Using Node to Read Really, Really Large Datasets (Pt 1)

Node.js can handle big data pretty, darn well.

How to Use Netflix's Eureka and Spring Cloud for Service Registry

Remove the complexity from microservice architectures.

Implementing JSON Web Tokens & Passport.js in a React App

How and why to use the various auth options Passport.js has to offer.

Postman vs. Insomnia: Comparing the API Testing Tools

The pros and cons of each testing tool, so you can find the best for your needs.

Using Docker & Docker Compose to Improve Your Full Stack App Development

The hardest part of a new project can be getting all the pieces running, but it doesn't have to be.

Sequelize: Like Mongoose but for SQL

The ORM for SQL databases with Node.js

Jib: Getting Expert Docker Results Without Any Knowledge of Docker

All of the containerization benefits, none of the complexity.

Docker 102: Docker-Compose

The recipe card for getting all your Dockerized apps to work together seamlessly.

Docker 101: Fundamentals & the Dockerfile

Containerize all project dependencies in one place for easy deployments anywhere.

React, SVG Images and the webpack Loader to Make Them Play Nice

React and SVGs did not start out friends. One npm package offered an answer.

Leveraging a Spring Cloud Config Server in a Node.js App's Feature Toggles (Pt 2)

Yes, you can use a Java config server to alter a Node.js service.

Why a Spring Cloud Config Server is Crucial to a Good CI/CD Pipeline (Pt 1)

Store and update variables your app will need to run in just one place.

What is Graphql, Really?

The API standard providing a more efficient, powerful and flexible alternative to REST.

JavaScript Array Methods to Make You a Better Developer

Learn to manipulate arrays like a pro.

How I Earned a Full-time Software Engineer Offer in 6 Months

After I graduated from coding bootcamp, my hard work was only just beginning.

How I Went From a Digital Marketer to a Software Engineer in 4 Months

Like many people, my career path to web development wasn't a straight line.