dwayne

Problem: What does a Modern Front-End Development Workflow Look Like?

I want to start writing libraries and large applications using the JavaScript language. However, I don't know how to setup the project and which build tools to use. What I do know is that the JavaScript community has moved way beyond using browser developer tool plugins and strategically-placed console.log() statements to debug, test, and build code.

I need help.

Below, I will keep track of articles, tutorials and tools I come across as I search for a way to bring my front-end development chops up-to-date.

The Ultimate Resource

willpatera

Overview

This collection of files serves as a simple static demonstration of how to post to a google spreadsheet from an external html <form> following the example by Martin Hawksey

Depreciation Warning: This code is not maintained, and should be seen as reference implementation only. If you're looking to add features or update, fork the code and update as needed.

Run example

You should be able to just open index.html in your browser and test locally.

timneutkens

New Results:

sorted by rerender time

Solution	Use CSS	Use Inline-Styles	Mount Time (ms)	Rerender time (ms)
react (without styles)	-	-	16.11	29.96
styled-jsx-static	+	-	25.27	42.24
emotion-extract-static	+	+	52.29	44.79
react-css	+	+	28.17	46.18
styletron	+	-	53.03	47.36

vinicius5581

import { combineReducers } from 'redux'

const reducerTest = (state = {}) => state;


export default combineReducers({
  reducerTest
})

cristianexer

const brain = require('brain.js');
var ezcsv = require('ezcsv');

const trainPath = './train.csv';
const testPath = './test.csv';
const gp = './gpinr.csv';

var train = ezcsv.csv.read(trainPath);
var test = ezcsv.csv.read(testPath);
var gpinr = ezcsv.csv.read(gp);

RedHatter

import React, { useState, useContext, useRef } from 'react'
import { DatePicker } from 'material-ui-pickers'
import { MuiPickersContext } from 'material-ui-pickers'

export default function DateMultiPicker({
  value,
  onChange,
  labelFunc,
  format,
  emptyLabel,

fullyninja

// ==UserScript==
// @name         Jira Dark Mode
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  Convert Jira to dark mode.
// @author       Peter Evans
// @match        https://*.atlassian.net/*
// @grant        none
// @require      https://cdn.walkme.com/player/resources/wmjQuery3315.js
// ==/UserScript==