treyhuffine

Strictly Frameworks

• Mobiledoc - github.com/bustle/mobiledoc-kit - framework to build editors with a standardized JSON structure
• ShareDB - github.com/share/sharedb - framework to sync any JSON document using operational transforms, add real-time collaborative editing to anything else
• Bangle.dev - github.com/bangle-io/bangle.dev - toolkit built for building editors, based on prosemirror

Abstracted Editors

These use separate document structures instead of HTML, some are more modular libraries than full editors

treyhuffine

const outerFunction = () => {
  let storedValue = 0;
  
  // returning a function from a function is the key
  return () => {
    storedValue = storedValue + 1;
    console.log('storedValue = ', storedValue);
  };
};

treyhuffine

import './styles.css';

const ClassStylesComponent = () => {
  const [isActive, setIsActive] = useState(false);
  const className = isActive ? 'button--active' : 'button';

  return (
    <div>
      <button onClick={() => setIsActive(!isActive)} className={className}>
        click me

treyhuffine

.button {
  background-color: gray;
}

.button--active {
  background-color: green;
}

treyhuffine

import styled from 'styled-components';

const Button = styled.button`
  background-color: ${({ isActive }) => (isActive ? 'green' : 'gray')};
`;

const CssInJsComponent = () => {
  const [isActive, setIsActive] = useState(false);

  return (

treyhuffine

const getMaxProfit = (prices) => {
  let minPrice = prices[0];
  let maxProft = 0;

  for (const price of prices) {
    const currentProfit = price - minPrice;
    minPrice = Math.min(minPrice, price);
    maxProft = Math.max(maxProft, price - minPrice);
  }

treyhuffine

const getMaxProfit = (prices) => {
  let maxProfit = 0;
    
  for (let buyDay = 0; buyDay < prices.length; buyDay++) {
    const buyPrice = prices[buyDay];

    for (let sellDay = buyDay + 1; sellDay < prices.length; sellDay++) {
      const sellPrice = prices[sellDay];
      const currentProfit = sellPrice - buyPrice;

treyhuffine

const apiRequest = () => {
  return new Promise((resove) => {
    // do some async things for an unknown amount of time...
    return resolve({ answer: 42 });
  })
}

const run = () => {
  apiRequest.then((response) => {
    console.log(response);

treyhuffine

const apiRequest = async () => {
  // do some async things for an unknown amount of time...
  return { answer: 42 } ;
}

const run = async () => {
  const response = await apiRequest();
  console.log(response);
}

treyhuffine

FROM postgres:latest
ARG FILE
ARG DBNAME
ENV FILE ${FILE}
ENV DBNAME ${DBNAME}
VOLUME /tmp

COPY ${FILE} /tmp/${FILE}

COPY restore_database.sh /docker-entrypoint-initdb.d/restore_database.sh