mhaagens

const FadeRoute = ({ component: Component, ...rest }) => {

  return (
    <Route {...rest} children={({ location, match }) => (
      <TransitionMotion
        willEnter={() => {return {opacity: 0, translateX: 24}}}
        willLeave={() => {return {opacity: spring(0, animationPresets.out), translateX: spring(24)}}}
        defaultStyles={[ {
          key: location.pathname,
          style: { opacity: 0, translateX: 24},

mhaagens

import http from 'http';
import app from './server';

const port = 3000;

const server = http.createServer(app.callback()).listen(3000);

if (module.hot) {
    module.hot.accept('./server', () => {
        server.removeAllListeners('request', server);

mhaagens

import React, { Component } from "react";

class AutoComplete extends Component {

	constructor(props) {
		super(props)
		this.state = {
			query: ""
		}
	}

mhaagens

const CustomDiv = styled(Animated.view)`
  transform: ${props => `rotate(props.rotateDeg)`}
`;

class App extends Component {
  constructor(props) {
    super(props)
    this.state = {
      rotate: new Animated.Value(0)
    }

mhaagens

import React from "react";
import { Route } from "react-router-dom";
import TransitionGroup from "react-transition-group/TransitionGroup";
import { firstChild } from "../../utils/helpers";

const AnimatedRoute = ({ component: Component, exact, path }) => (
  <Route
    exact={exact}
    path={path}
    render={({ match, ...rest }) => (

mhaagens

/* HOC fundamentally is just a function that accepts a Component and returns a Component:
  (component) => {return componentOnSteroids; } or just component => componentOnSteroids;
  Let's assume we want to wrap our components in another component that is used for debugging purposes, 
  it just wraps them in a DIV with "debug class on it".
  Below ComponentToDebug is a React component.
*/

//HOC using Class
  //it's a function that accepts ComponentToDebug and implicitly returns a Class
let DebugComponent = ComponentToDebug => class extends Component {

mhaagens

FROM node:alpine
WORKDIR /code
run apk --no-cache add --virtual native-deps \
  g++ gcc libgcc libstdc++ linux-headers make python && \
  npm install --quiet node-gyp -g && \
  npm rebuild node-sass --force && \
  apk del native-deps
CMD ["yarn", "start"]
EXPOSE 9000

mhaagens

const { ApolloServer } = require("apollo-server");
const { typeDefs, resolvers } = require("./schema.js");
const requireAuthDirective = require("./directives/requireAuthDirective");

const server = new ApolloServer({
  typeDefs,
  resolvers,
  schemaDirectives: {
    requireAuth: requireAuthDirective
  },

mhaagens

const path = require("path");
const chokidar = require("chokidar");
const reload = require("require-reload")(require);
let server = reload("./src/app.js");

const srcDir = path.resolve(__dirname, "src");
const watcher = chokidar.watch(srcDir + "/**/*.js", {});

watcher.on("ready", () =>
  server

mhaagens

const { gql } = require("apollo-server");
const _ = require("lodash");
const { postDefs, postResolvers } = require("./models/post.js");

module.exports.typeDefs = gql`
  enum Role {
    ADMIN
    USER
  }