Discover @ryanhefner Open Source projects

Ryan Hefner (@ryanhefner)

ryanhefner

Stars
406
Global Rank 69,322 (Top 3 %)
Followers 108
Following 136
Registered over 14 years ago
Most used languages

JavaScript
94.9 %

Python
2.6 %

TypeScript
2.6 %
Location 🇺🇸 United States
Country Total Rank 17,251
Country Ranking

JavaScript
3,392

react-scroll-trigger

📜 React component that monitors scroll events to trigger callbacks when it enters, exits and progresses through the viewport. All callback include the progress and velocity of the scrolling, in the event you want to manipulate stuff based on those values.

react-contentful

📰 A React component library that makes it super simple to compose Contentful content into your sites and applications.

calculate-aspect-ratio

📐 A simple utility function, and command line utility, for calculating an aspect ratio based on width and height.

stylex

Easily convert CSS styles from the DOM to Javascript, and back.

next-contentful

📰 React library for integrating react-contentful into the server-side rendering of your Next.js app.

react-timer-wrapper

Composable React Timer component that passes status props to children, in addition to some basic callbacks. Can be used at a countdown timer ⏲ or as stopwatch ⏱ to track time while active.

react-video-players

📺 Library of React video player components that offer a consistent interface and callback system for Vimeo, YouTube and the <video> tag. Along with a handy higher order component for building your own 😉

contentful-sitemap

🗺 Build a dynamic sitemap.xml file based on content pulled in from Contentful via the Contentful API.

contentful-parsers

🧰 Toolbox of useful parsers to use when working with Contentful API responses.

react-animate-props

React higher order component and hook for transforming your favorite components to animate prop values on change.

googlecast-wrappers

Simplifying the creation of Google Cast (Chrome) Sender and Receiver apps.

clean-react-props

🛁 Utility functions for passing clean React props to HTML and SVG elements.

react-timecode

⏳ Simple React component for displaying a timecode, with various formatting options.

tweenkle

✨ Lightweight tweening library built for modern Javascript environments that favor small modular components over heavy monolithic bundled libraries.

react-rotator

🎠 Flexible React component for composing rotators, carousels, slideshows and more.

react-canvas-wrapper

🖼 React component that wraps a canvas element and offers a clean API for drawing.

react-maps-google

🗺 React components that make it easy to add Google maps and markers to your React projects.

apollo-link-contentful

🔗 An ApolloLink that lets you perform GraphQL queries against Contentful’s Rest API. No more, query size limits! No more, query complexities!!

react-indicators

Responsive, canvas-based indicators that you can use to communicate the progress of loaders, timers or whatever else you might need a progress indicator for.

Object.assign

Simple ES6 Object.assign() polyfill for older environments.

react-prismic

📰 Easily compose Prismic requests and data into your React applications.

react-zendesk-helpcenter

📖 React library that makes it easy to render Zendesk Help Center content in your React apps.

next-prismic

📰 React library for integrating @ryanhefner/react-prismic into the server-side rendering of your Next.js app.

ryanhefner

lomit

🪶 Lightweight object omit method, just because.

BuildAntTarget

A flexible ANT Build System for Sublime Text 2 and 3 that doesn't require the build.xml be in the root of your project, and offers target selection.

Array.prototype.findIndex

Simple Array.prototype.findIndex polyfill for older environments.

react-speedo

⏱ Tooling to help you monitor the performance of your React applications.

react-request-block

React component to compose requests within your components, with support for server-side rendered requests.

creature-cache

🧟‍♂️ An in-memory cache that can be restored/rehydrated (brought back to life) via a string or array to rebuild the cache Map.

nextprops

quiktime

⏱ Quickly format duration time values in a condensed format.

filesizes

📂⚖️ Easily review the size of files in a given directory and its subdirectories.

react-hash-handler

#️⃣ React component that makes it easy to compose hash change and click handling into your application or site.

react-target-scroller

🎯 React component that smoothly scrolls to the target element passed in via props.

file-counter

Calculate the number of files within a directory and its subdirectories. Apply rules to filter files or directories from the total.

use-dependency-alert

🚨 React hook for debugging hook dependency arrays to validate what is changing, and how often.

next-request-block

React library for integrating react-request-block into the server-side rendering of your Next.js app.

react-hoc-helpers

🧰 Collection of helpful utilities and helpers for when working with React higher-order components (HOC).

package-template-rollup

Base structure that I have been using for the majority of the NPM packages I have written/maintain. Suggestions on how to make this nicer welcomed!