bobbygrace

Hello, visitors! If you want an updated version of this styleguide in repo form with tons of real-life examples… check out Trellisheets! https://github.com/trello/trellisheets

---

Trello CSS Guide

“I perfectly understand our CSS. I never have any issues with cascading rules. I never have to use !important or inline styles. Even though somebody else wrote this bit of CSS, I know exactly how it works and how to extend it. Fixes are easy! I have a hard time breaking our CSS. I know exactly where to put new CSS. We use all of our CSS and it’s pretty small overall. When I delete a template, I know the exact corresponding CSS file and I can delete it all at once. Nothing gets left behind.”

You often hear updog saying stuff like this. Who’s updog? Not much, who is up with you?

alekseykulikov

Recently CSS has got a lot of negativity. But I would like to defend it and show, that with good naming convention CSS works pretty well.

My 3 developers team has just developed React.js application with 7668 lines of CSS (and just 2 !important). During one year of development we had 0 issues with CSS. No refactoring typos, no style leaks, no performance problems, possibly, it is the most stable part of our application.

Here are main principles we use to write CSS for modern (IE11+) browsers:

• SUIT CSS naming conventions + SUIT CSS design principles;
• PostCSS + CSSNext. Future CSS syntax like variables, nesting, and autoprefixer are good enough;
• Flexbox is awesome. No need for grid framework;
• Normalize.css, base styles and variables are solid foundation for all components;

bcoe

npm Users By Downloads (git.io/npm-top)

---

npm users sorted by the monthly downloads of their modules, for the range May 6, 2018 until Jun 6, 2018.

Metrics are calculated using top-npm-users.

#	User	Downloads

xem

codegolf JS

Mini projects by Maxime Euzière (xem), subzey, Martin Kleppe (aemkei), Mathieu Henri (p01), Litterallylara, Tommy Hodgins (innovati), Veu(beke), Anders Kaare, Keith Clark, Addy Osmani, bburky, rlauck, cmoreau, maettig, thiemowmde, ilesinge, adlq, solinca, xen_the,...

(For more info and other projects, visit http://xem.github.io)

(Official Slack room: http://jsgolf.club / join us on http://register.jsgolf.club)

neonto

--> Star this gist if you want to see it on the Reactive 2016 conference <--

Writing React.js is fun... But being able to draw React components, design responsive layouts and create entire app flows visually can be even more fun! (Especially for those non-coder members of your team who think ECMAScript 6 is a skin disease. They should see the light of React too.)

In this lightning talk, we'll give you a world premiere sneak peek at React Studio (www.reactstudio.com), a GUI tool built specifically for React. We'll explain how React's functional design makes it a great fit for visual tools. Also we will show how React Studio's plugin approach makes it a really powerful meta-programming system. Want to switch your app from Redux to Alt.js or vice versa? Just swap the state plugin and export again! That's just one of the joys of using a visual system for your Reactified visual design.

https://reactiveconf.com

ykarikos

#!/bin/bash

if [ "$1" == "" ]; then
  echo Usage: $0 pngfile
  exit 0;
fi

FILE=`basename $1 .png`

if [ ! -e $FILE.png ]; then

pmeenan

// Support routines for automatically reporting user timing for common analytics platforms
// Currently supports Google Analytics, Boomerang and SOASTA mPulse
// In the case of boomerang, you will need to map the event names you want reported
// to timer names (for mPulse these need to be custom0, custom1, etc) using a global variable:
// rumMapping = {'aft': 'custom0'};
(function() {
var wtt = function(n, t, b) {
  t = Math.round(t);
  if (t >= 0 && t < 3600000) {
    // Google Analytics

ndarville

Business Models

Advertising

Models	Examples
Display ads	Yahoo!
Search ads	Google

bluesmoon

<script id="nb-loader-script">
(function(url) {

  // document.currentScript works on most browsers, but not all
  var where = document.currentScript || document.getElementById("nb-loader-script"),
      promoted = false,
      LOADER_TIMEOUT = 3000,
      IDPREFIX = "__nb-script";

  // function to promote a preload link node to an async script node

jed

            DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
                    Version 2, December 2004

 Copyright (C) 2011 Jed Schmidt <http://jed.is>

 Everyone is permitted to copy and distribute verbatim or modified
 copies of this license document, and changing it is allowed as long
 as the name is changed.

            DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE