Trending Posts

Trending

Artificial Intelligence

Unsure How to Start Building with AI? Build Something You Dislike

Here's the on-ramp to building with AI that I've found that actually works: build something you really don't like.

Gus Schissler Software Consultant & Delivery Lead in Ann Arbor. Maker, learner, jack-of-all-trades. I thrive in finding elegant solutions to complex problems.

Categories

Most Recent View more recent posts →

Evolving the Industry • Jul 25

Atomic Object Raleigh Is Now a Majority-Women Office

In late June, our office crossed a threshold worth reflecting on. For the first time, women make up the majority at my workplace.

AI for Developers • Jul 24

Here’s What Happened When I Revisited Our Code Review Experiment

I recently wrote about my client team's decision to make human code review optional. Enough time has passed to share some honest reflections.

Growing as Makers • Jul 23

Who Decides What’s Worth Building? Growing Judgment Work Across the Team

Agentic engineering is changing the shape of how software teams work, and in doing so, is raising the value of judgment work.

View more recent posts

Developer Tools View more Developer Tools posts →

Author Sully Bah with his team at Atomic. Post title: Swagger In A Box: NPM, APIs, And Swagger Codegen

Developer Tools

Swagger In A Box: NPM, APIs, and Swagger Codegen

read post

Zellij - A Terminal Workspace

Developer Tools

Here’s Why I’m Using Zellij – A Terminal Workspace

read post

Author Jordan Booker with a colleague. Post title: More on How JSDoc Saved the Day: ESLint Enters the Chat

Developer Tools

More on How JSDoc Saved the Day: ESLint Enters the Chat

read post

Two developers look at a monitor and discuss using Lima for an AI Coding Agent Sandbox

Developer Tools

How I Used Lima for an AI Coding Agent Sandbox

read post

View more Developer Tools posts

UX/Design Tools View more UX/Design Tools posts →

View more UX/Design Tools posts

React / Redux View more React / Redux posts →

Shadcn 101 - Create a Searchable Dropdown

React / Redux

Shadcn 101: Create a Searchable Dropdown

To create a searchable dropdown in Shadcn, we'll combine the Command and Popover components to form an element that serves many needs.

Pictured is author Lizzie Paris with colleagues. Post title: Authenticated Routes with TanStack Router

React / Redux

Authenticated Routes with TanStack Router

My software development team is currently using TanStack Router on a project. I set up our basic routing infrastructure: here was my process.

Pictured is author Jared Surato. Post title: Smarter Data Fetching with TanStack Query: Reusable Patterns and Optimistic UI

React / Redux

Smarter Data Fetching with TanStack Query: Reusable Patterns and Optimistic UI

Here are a few especially helpful patterns for real-world projects, including reusing query configuration across components.

View more React / Redux posts

Web Apps View more Web Apps posts →

Web Apps

Build a 3D Product Configurator with Babylon.js

read post

How to Build and Publish Browser Extensions for Chrome, Firefox, and Safari

Web Apps

How to Build and Publish Browser Extensions for Chrome, Firefox, and Safari

read post

Embedding Payload CMS 3.0 Admin UI in Your Next.js App

Web Apps

Embed Payload CMS 3.0 Admin UI in Your Next.js App

read post

About a year ago, I used Remix on a short prototype app to that displayed a series of reports and I loved it. For those who don’t know. Remix is a framework for building websites. It uses React JS as a base and adds some specialized compiling. The app was a great use case for Remix for a few reasons. First, the pre-built stacks got the app deployed quickly. The main parts of Remix that shined were its prefetching, directory-based routing, and its loader functions. The prefetching helped the reports load faster because some data would be retrieved before the user navigated. The directory-based routing made it easy to setup the structure of the app. Last, Remix’s loader functions were able to retrieve small amounts of data each as it was needed. I am now using Remix on a second website that has a different structure than the prototype and we aren’t able to use the same features to the same degree. This time around, I am finding myself using fewer of the features mentioned previously. We aren’t using perfecting because we have a single page with a lot of complexity. We have fewer loader functions retrieving lots of information at once which makes them perform worse. The main difference that I found between the two projects is that the prototype was a multipage app and the second has been turning into a single page app (SPA). Based on Remix's documentation and my experience the best use cases for Remix are ones that can be modeled as multiple pages. Challenges for single page apps For this post, when I refer to a single page app I am referring to an app that tries to pack a variety of behaviors onto a single route. An example would be Google Calendar. Pictured below: In order to render this page, we need to load a few different things. We need to load all the events for this month, all the calendars for the user, and the details for the apps along the lefthand side. Then to use the app, we need to track which event is selected. When the user drags an event, we need to keep track of the calendar it is on. Then when it is placed, an alert is displayed if there are any conflicts. This state and behavior may need to be done in one component, which means one loader function. We may also want to perform component tests which are only partially supported in Remix, based on this git conversation. Make it optimal Instead, let’s talk about structuring an app to leverage Remix’s strengths. I am assuming we want to make use of Remix’s speedy loading while getting around some of its component testing limitations.The files that are used for routing should each be responsible for retrieving, displaying and mutating a limited set of information. As an example of a UI structure that could work well in Remix let’s look at Slack. Slack's UI can be visually broken down into three sections. The workspaces are on the far left. Then the channels within the selected workspace are listed, and lastly, we have the current chat for the selected workspace. A Remix app with this UI could have a URL like: slack/workspace2/proj-new-website. The root of the app would get the list of all workspaces, then /workspace2 would load the details for the selected workspace. Lastly, the chat window for /proj-new-website would load the chats and display them. This app can be modeled as a multipage app because the responsibilities are spread at different levels of the page instead of being concentrated in one component, like with the Google Calendar example. This would be a Slack-like app, and a better use case for Remix than a calendar app. Use the right tool for the job Remix is a powerful tool for web development. It can produce polished prototypes quickly and can build performant production apps. However, an app in Remix needs to keep Remix's design principles in mind. This means splitting the app's pages into pieces that can be loaded and rendered separately and keeping components as simple as possible in order to limit component testing on the frontend. Designing an app this way will enable the app to leverage the performance benefits promised by Remix.

Web Apps

Remix is Incredible — If It Fits Your Use Case

read post

View more Web Apps posts

Development Practices View more Development Practices posts →

View more Development Practices posts

DevOps & System Admin View more DevOps & System Admin posts →

Author Mattie Behrens (R) talks with a co-worker about this post: A Webserver and a Slack Bot on OpenBSD: Introducing relayd

DevOps & System Admin.

A Webserver and a Slack Bot on OpenBSD: Introducing relayd

read post

Pictured is author Casey Falkowski with co-workers. Post title: Bringing Confidence to Complex Data Migrations with Snapshot Testing

DevOps & System Admin.

SST Makes Infrastructure Easy — Too Easy?

read post

Hot Reloading Kubernetes with Skaffold

DevOps & System Admin.

How to Hot Reload Kubernetes with Skaffold

read post

Docker Compose Dependency Management Isn't a Silver Bullet

DevOps & System Admin.

Docker Compose Dependency Management Isn’t a Silver Bullet

read post

View more DevOps & System Admin posts

Extracurricular Activities View more Extracurricular Activities posts →

I Turned My Cats Into A Codex Pet

Extracurricular Activities

I Turned My Cats Into a Codex Pet

I would bring my cats everywhere with me if I could. So, I used codex-pets.net to turn my two tabby cats into a custom Codex Pet.

Automating an Art Commission Pipeline with Zapier

Extracurricular Activities

Automating an Art Commission Pipeline with Zapier

Why struggle with your current workflow when we can find a solution to the problem using technical tools? Let's check out Zapier.

View more Extracurricular Activities posts

.NET / WPF View more .NET / WPF posts →

View more .NET / WPF posts

Personal Optimization View more Personal Optimization posts →

A delivery lead types on her laptop. Post title: Build Alignment Using a Product Requirements Document

Personal Optimization

Build Alignment Using a Product Requirements Document

read post

Personal Optimization

How I’m Going Analog at My Tech Job: My Favorite Offline Tools

read post

Teaching Your Notes to Talk Back

Personal Optimization

Teach Your Notes to Talk Back

read post

Decorations spelling out "Happy Birthday." Post title: Never Missing a Birthday Again with Sheets + Slack

Personal Optimization

Never Missing a Birthday Again with Sheets + Slack

read post

View more Personal Optimization posts

TypeScript View More TypeScript posts →

View More TypeScript posts

React Native View more React Native posts →

A developer's hands on a keyboard. Post title: A Beginner's Guide to Setting Up a React Native Dev Environment

React Native

A Beginner’s Guide to Setting Up a React Native Dev Environment

The initial setup to launch a React Native dev environment involves a few tricks. Here’s a simple breakdown that will help you out.

React Native

How to Recreate the Omnichord for the iPad with React Native

A few months back, our drummer came into rehearsal, reached into his backpack and pulled out an Omnichord.

Pictured is author Jared Surato with colleagues. Post title: Here's What I’ve Learned After a Year of Full Time React Native Development

React Native

Here’s What I’ve Learned After a Year of Full-Time React Native Development

A year of full-time React Native development has taught me that success comes from consistent habits. Here are the ones that matter most.

View more React Native posts

Growing as Makers View more Growing as Makers posts →

Pictured is a development team at Atomic Object's Ann Arbor office. Post title: Who Decides What's Worth Building? Growing Judgment Work Across the Team

Growing as Makers

Who Decides What’s Worth Building? Growing Judgment Work Across the Team

read post

Author Patrick Pale is shown chatting with colleagues about his latest Spin post, "An Overview of 8 Years of Projects as a Software Consultant"

Growing as Makers

An Overview of 8 Years of Projects as a Software Consultant

read post

A networking event. Post title: What Predatory Media Pitches Reveal About Our Need for Real Community

Growing as Makers

The Visibility Trap: What Predatory Media Pitches Reveal About Our Need for Real Community

read post

Pictured is author Dre Solorzano. Post title: Software Development Lessons Learned from Video Games: Don’t Forget to Side Quest

Growing as Makers

Software Development Lessons Learned from Video Games: Don’t Forget to Side Quest

read post

View more Growing as Makers posts

Atomic Thinking View more Atomic Thinking posts →

Two developers from the Atomic Object Raleigh-Durham office which is majority female now.

Evolving the Industry

Atomic Object Raleigh Is Now a Majority-Women Office

In late June, our office crossed a threshold worth reflecting on. For the first time, women make up the majority at my workplace.

A developer's hands on a keyboard. Post title: Here's What Happened When I Revisited Our Code Review Experiment

AI for Developers

Here’s What Happened When I Revisited Our Code Review Experiment

I recently wrote about my client team's decision to make human code review optional. Enough time has passed to share some honest reflections.

Pictured is a development team at Atomic Object's Ann Arbor office. Post title: Who Decides What's Worth Building? Growing Judgment Work Across the Team

Growing as Makers

Who Decides What’s Worth Building? Growing Judgment Work Across the Team

Agentic engineering is changing the shape of how software teams work, and in doing so, is raising the value of judgment work.

View more Atomic Thinking posts