Skip to content

Instantly share code, notes, and snippets.

View xxRockOnxx's full-sized avatar

Lemuel Flores xxRockOnxx

View GitHub Profile
@sandren
sandren / tailwind.md
Last active April 26, 2024 12:37
Tailwind CSS best practices

Tailwind CSS best practices

Utility classes

  1. When writing a string of multiple utility classes, always do so in an order with meaning. The "Concentric CSS" approach works well with utility classes (i.e,. 1. positioning/visibility 2. box model 3. borders 4. backgrounds 5. typography 6. other visual adjustments). Once you establish a familiar pattern of ordering, parsing through long strings of utility classes will become much, much faster so a little more effort up front goes a long way!

  2. Always use fewer utility classes when possible. For example, use mx-2 instead of ml-2 mr-2 and don't be afraid to use the simpler p-4 lg:pt-8 instead of the longer, more complicated pt-4 lg:pt-8 pr-4 pb-4 pl-4.

  3. Prefix all utility classes that will only apply at a certain breakpoint with that breakpoint's prefix. For example, use block lg:flex lg:flex-col lg:justify-center instead of block lg:flex flex-col justify-center to make it very clear that the flexbox utilities are only applicable at the

@gmolveau
gmolveau / fathom_to_heroku.md
Last active July 11, 2020 18:06
How to push Fathom analytics - https://github.com/usefathom/fathom to Heroku

Deploy Fathom on Heroku

Requirements

  • heroku cli (logged in)
  • git
  • curl
  • wget
  • tar are required
  • ~ openssl is required to generate the secret_key, but you're free to use what you want
@kottenator
kottenator / simple-pagination.js
Created July 13, 2015 20:44
Simple pagination algorithm
// Implementation in ES6
function pagination(c, m) {
var current = c,
last = m,
delta = 2,
left = current - delta,
right = current + delta + 1,
range = [],
rangeWithDots = [],
l;
@ghinda
ghinda / object-to-form-data.js
Last active May 21, 2024 20:48
JavaScript Object to FormData, with support for nested objects, arrays and File objects. Includes Angular.js usage.
// takes a {} object and returns a FormData object
var objectToFormData = function(obj, form, namespace) {
var fd = form || new FormData();
var formKey;
for(var property in obj) {
if(obj.hasOwnProperty(property)) {
if(namespace) {

Folder Structure

Please note

While this gist has been shared and followed for years, I regret not giving more background. It was originally a gist for the engineering org I was in, not a "general suggestion" for any React app.

Typically I avoid folders altogether. Heck, I even avoid new files. If I can build an app with one 2000 line file I will. New files and folders are a pain.

@soheilhy
soheilhy / nginxproxy.md
Last active May 16, 2024 08:59
How to proxy web apps using nginx?

Virtual Hosts on nginx (CSC309)

When hosting our web applications, we often have one public IP address (i.e., an IP address visible to the outside world) using which we want to host multiple web apps. For example, one may wants to host three different web apps respectively for example1.com, example2.com, and example1.com/images on the same machine using a single IP address.

How can we do that? Well, the good news is Internet browsers

@Ocramius
Ocramius / User.php
Last active February 16, 2024 14:57
Doctrine 2 ManyToMany - the correct way
<?php
use Doctrine\ORM\Mapping as ORM;
use Doctrine\Common\Collections\ArrayCollection;
/**
* @ORM\Entity()
* @ORM\Table(name="user")
*/
class User
@ideiudicibus
ideiudicibus / Beanutils.java
Created May 10, 2011 14:17
Merge two java beans useful when discovering differences
class Beanutils{
//merge two bean by discovering differences
private <M> void merge(M target, M destination) throws Exception {
BeanInfo beanInfo = Introspector.getBeanInfo(target.getClass());
// Iterate over all the attributes
for (PropertyDescriptor descriptor : beanInfo.getPropertyDescriptors()) {
// Only copy writable attributes
if (descriptor.getWriteMethod() != null) {