Blog archive

Browse all tags

2020

Handling Scroll Based Animation in React (2-ways)

#react, #animation, #motion design, #interactivity, #javascript

Drag and Drop Component Builder using React

#react native, #react, #design systems

Setting up a React Native Component Library

#react native, #react, #design systems, #devops, #project management, #storybook, #typescript, #expo, #eslint

Restyle for React Native (vs Styled System)

#react native, #react, #design systems

Adding Game Controller Input to React

#game design, #react, #javascript

Building Responsive Figma Components

#design systems, #figma, #design, #ui kit

Syncing Figma Styles with CSS in JS

#design systems, #productivity, #figma, #design ops, #theming, #css in js, #javascript

Creating a Design System Monorepo

#design systems, #monorepo, #productivity, #project management, #lerna, #yarn, #react, #javascript

Taking Notion to the Next Level

#productivity, #resource, #notion

Sharing Hooks Between React and Web Components

#web components, #react, #js, #design systems, #hauntedjs

Developer Discord Communities

#community, #resource, #discord

Limitations of Chakra UI

#chakra ui, #react, #js, #design systems, #seshsource

Adding Constructable Stylesheets to HauntedJS

#hauntedjs, #react, #js, #web components

Using Web Components with Gatsby and Preact

#gatsby, #react, #preact, #web components

Refreshing my blog for 2020

#gatsby, #react, #site updates

Testing out Gatsby's new incremental builds

#gatsby, #optimization, #netlify

xStyled vs Styled System for Design Systems

#design systems, #css, #react, #css in js

Comparing CSS vs CSS in JS bundle and load times

#css, #css in js, #styled components, #optimization

Easy APIs using Strapi - a NodeJS Headless CMS

#api, #backend, #cms, #nodejs, #js

Using MDX with NextJS (and when to go Gatsby)

#nextjs, #react, #mdx, #productivity, #gatsby, #resource

Creating Speaker Decks with NextJS and MDX

#nextjs, #react, #productivity, #resources, #template

Creating a Blog or Docs using Web Components

#markdown, #web components, #productivity, #template, #resource, #open source

Utility Props for Web Components

#design systems, #web components, #css, #component library

Switching over to Notion

#notion, #project management, #productivity

Linting Commits with Emoji

#project management, #devops

Creating a Design System using Web Components

#design systems, #web components, #css, #component library

Utility CSS Props with Web Components

#design systems, #web components, #css, #component library

Theming in Modern Design Systems

#design systems, #css in js, #css, #sass, #utility css, #oocss, #component library

Adding Dark Mode to Styled Components

#css in js, #design systems, #gatsby, #javascript, #react

Documentation for Grommet

#documentation, #gatsby, #javascript, #react, #devops, #ux

Adding Typescript to Gatsby

#typescript, #gatsby, #javascript, #react

Why I switched to Figma over Sketch (and why you shouldn't)

#figma, #sketch, #app design, #graphic design

Setting up cPanel email from LAMP hosting with Zeit's Now

#devops, #zeit, #now, #cpanel, #lamp

2018

Comparing UX design apps for iOS πŸŽ¨πŸ“±

#design, #ux, #ios, #tips

Automating React Documentation using React-Docgen βš›βš™οΈπŸ“š

#react, #documentation, #node, #tips

Generate documentation for any React project using GatsbyJS

#documentation, #boilerplate, #react, #mdx, #javascript, #jsx, #guide

Deploy MDX-Deck to Netlify πŸš€

#react, #mdx, #javascript, #jsx, #guide, #tips

Adding testing, linting, and docs to a design system πŸ“š

#testing, #eslint, #prettier, #documentation, #design, #design system, #react, #open source, #javascript, #tutorial

Setting up ESLint + Prettier on project πŸ”

#testing, #eslint, #prettier, #react, #javascript

Creating a Design System for ReactJS from Scratch

#design, #design system, #react, #open source, #javascript, #tutorial

2 ways to auto-generate documentation for Laravel APIs πŸ“„βš™οΈ

#laravel, #api, #documentation, #workflow, #guide, #tips

Adding testing to a Laravel API πŸ“

#laravel, #tdd, #testing, #api, #php, #phpunit

Using Airbnb's React to Sketch app to generate Sketch style guide

#react, #javascript, #airbnb, #design system, #style guide, #tips, #tutorial

My Visual Studio Code Setup 🎨

#vscode, #tips, #resource

NextJS Tip: Hot reloading for dynamic servers

#nextjs, #express, #js, #es6, #tips

Express Middleware for API Requests

#nextjs, #express, #js, #api, #es6, #tips

How to create a PHP package for Composer

#composer, #php, #open source, #github, #tips, #tutorial

Kushy Frontend in NextJS

#nextjs, #js, #kushy, #react, #frontend

NextJS Tip: Relative ES6 Modules

#nextjs, #js, #es6, #tips

Lorem Ipsum Generator plugin for Sketch

#sketch, #resources, #free, #download

NextJS Tip - Using Media (Images & Fonts) in CSS

#nextjs, #react, #js, #css, #tips

shortcode - Make yourself Wordpress admin using SQL πŸ”‘βš‘οΈ

#wordpress, #sql, #shortcode, #code snippet, #tips

NextJS and Authentication using OAuth2 and JWT

#oauth2, #api, #laravel, #react, #nextjs, #ssr, #full stack, #backend, #frontend

shortcode - Protect NextJS pages with a authorization HOC πŸ”

#nextjs, #api, #js, #shortcode, #code snippet, #tips

shortcode - πŸ‹ Docker for Wordpress made easy

#laravel, #php, #api, #shortcode, #code snippet, #tips

shortcode - Reorder content with CSS Flexbox

#laravel, #php, #api, #shortcode, #code snippet, #tips

Creating an event ticketing service (Laravel API + ReactJS + NextJS + Material UI)

#api, #laravel, #react, #nextjs, #material ui, #ssr, #full stack, #backend, #frontend

shortcode - Apply middleware to Laravel controller methods

#laravel, #php, #api, #shortcode, #code snippet, #tips

shortcode - Change fields in a Laravel API Resource via transform

#laravel, #php, #api, #shortcode, #code snippet, #tips

shortcode - Lightbox using Semantic UI + JQuery πŸ–ΌπŸ”

#wordpress, #sql, #shortcode, #code snippet, #tips

Deploy a Static React Blog using GatsbyJS and Github

#design, #development, #react, #github, #gatsbyjs, #ssg, #static site generator

New blog, new brand, new stack

#design, #development, #react, #github, #gatsbyjs, #ssg, #static site generator