Skip to content

Instantly share code, notes, and snippets.

FROM ruby:2.3.3
RUN apt-get update -qq && apt-get install -y build-essential libpq-dev nodejs
RUN mkdir /app
WORKDIR /app
ADD Gemfile /app/Gemfile
ADD Gemfile.lock /app/Gemfile.lock
RUN bundle install
ADD . /app
EXPOSE 3000
CMD rails s -p 3000

tracked npm

@tracked is a decorator for Preact that makes working with state values no different than properties on your component instance.

It's one 300 byte function that creates a getter/setter alias into state/setState() for a given key, with an optional initial value. The "magic" here is simply that it works as a property decorator rather than a function, so it appears to integrate directly into the language.

tracked has no dependencies and works with any component implementation that uses this.state and this.setState().

Installation

@addyosmani
addyosmani / flexbox-layout.css
Created January 29, 2017 19:31
Flexbox layout helper classes
/*
Flexbox CSS helpers from the Polymer team. Extracted from https://github.com/PolymerElements/iron-flex-layout for use as just CSS.
Docs: https://elements.polymer-project.org/guides/flex-layout
@license
Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
@n1ru4l
n1ru4l / ArtistList.js
Created January 24, 2017 15:42
mobx + apollo-client + react
import React from 'react'
import { observer } from 'mobx-react'
function ArtistList({ uiState: { artistData } }) {
const { data } = artistData;
if ( !data || !data.artists || !data.artists.length ) {
return <div>No artists bruh.</div>
}
const { artists } = data
return (
@JEG2
JEG2 / training.md
Created August 18, 2016 01:29
Please help me prepare my ElixirConf training.

ElixirConf Training Sneak Peek

I've done a practice run of one fourth of my ElixirConf training. It was very helpful to me and I would like a little more practice.

I plan to run sessons for one half of my training next week. The sessions will be:

  • Tuesday at 7:00 PM Central Time: Process Basics
  • Wednesday at 7:00 PM Central Time: "Special Processes"

Each session is planned to last about an hour and a half.

@pizzarob
pizzarob / 01_DropZone.jsx
Last active July 12, 2024 07:05
HTML5 Drag and Drop File Upload React Component
import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
const ANIMATION_DURATION = 1000;
class BatchDropZone extends React.Component {
static propTypes = {
@dmeents
dmeents / navigation.js
Created July 19, 2016 00:44
The complete source code for the Creating a collapsible navigation menu in react
import React, { Component } from 'react';
import { Link } from 'react-router';
import classNames from 'classnames';
import MobileNav from 'react-icons/lib/io/navicon-round';
//navigation display
export default class NavContainer extends Component {
constructor(props) {
super(props);
this.state = {

Deploying Elixir and Phoenix applications using Docker and Exrm

Goal

By the end of this quick guide, you will know how to compile a Phoenix app release using Exrm and run it inside a Docker container. I've found only a couple of articles that discuss getting an Elixir app up and running inside a Docker container, and even those only touched on some parts of the process. The idea is that this guide will give you a full end-to-end example of how to get all the pieces and parts working together so that you are able to deploy your Phoenix application inside a Docker container.

Assumptions

  1. You already have a working Elixir environment with the Phoenix Framework installed
  2. You have at least basic working knowledge of Docker, and have installed the Docker tools onto your local environment
@diegoconcha
diegoconcha / redux_egghead_notes.md
Last active January 18, 2022 13:23
Redux Egghead.io Notes

###Redux Egghead Video Notes###

####Introduction:#### Managing state in an application is critical, and is often done haphazardly. Redux provides a state container for JavaScript applications that will help your applications behave consistently.

Redux is an evolution of the ideas presented by Facebook's Flux, avoiding the complexity found in Flux by looking to how applications are built with the Elm language.

####1st principle of Redux:#### Everything that changes in your application including the data and ui options is contained in a single object called the state tree

@christopherstyles
christopherstyles / active_admin_filter_for_has_many_through.rb
Created December 15, 2015 23:29
ActiveAdmin filter, for a has_many :through association
# app/models/user.rb
class User < ActiveRecord::Base
has_many :permissions
has_many :roles, through: :permissions
scope :by_role, lambda { |role_ids|
joins(:permissions).where(permissions: { role_id: Array.wrap(role_ids) })
}
ransacker :role,