Skip to content

Instantly share code, notes, and snippets.

View wasinsandiego's full-sized avatar

Will Schoenberger wasinsandiego

View GitHub Profile
const warning = (maxLength, startLimit, endLimit, delimiter) => (
console.warn(`middleEllipsis :: The start (${startLimit}) and end \
(${endLimit}) plus the delimiter (${delimiter}) add up to more than \
the limit (${startLimit + endLimit + delimiter.length} > ${maxLength}). \
This will produce a truncated string larger than your maxLength.`)
)
const middleEllipsis = ({ text = '', maxLength = 47, start, end, delimiter = '...' }) => {
if (text.length < maxLength) { return text }
const startLimit = start || Math.floor((maxLength - delimiter.length) / 1.6)

🔻

NOTE: This page is currently a work in progress. There is a lot to cover in detail. The plan is to breakout details on conventions like 'How To Write Your Selectors' and 'How To Normalize Your Data' a bit later. For now just look for existing examples in the code or ask a friend.

To get the quick and dirty bullet list, scroll down to the TL;DR; below.


React Best Practices & Patterns

There are a few tricks we've picked up since we started that will help us with debugging, reuse, scalability, performance, and common pitfalls of complex singles page app development. We are not code Nazis but getting familiar with these things will help the whole team increase output and reduce code debt. These things should be pointed out in code reviews and corrected.

The goal is to write consistent code with less opportunities for bugs. Complex code is buggy code. It's really that simple.

# Your init script
#
# Atom will evaluate this file each time a new window is opened. It is run
# after packages are loaded/activated and after the previous editor state
# has been restored.
#
# An example hack to log to the console when each text editor is saved.
#
# atom.workspace.observeTextEditors (editor) ->
# editor.onDidSave ->