Skip to content

Instantly share code, notes, and snippets.

@chee
Last active March 7, 2018 17:32
Show Gist options
  • Save chee/9ca084e2da224fee8d73d36c476c873f to your computer and use it in GitHub Desktop.
Save chee/9ca084e2da224fee8d73d36c476c873f to your computer and use it in GitHub Desktop.
#!/bin/sh
name="$1"
mkdir $name
cd $name
yarn init -y
yarn add --dev babel-preset-react-app babel-plugin-transform-es2015-modules-commonjs
yarn add react react-dom
cat <<LOL > .babelrc
{
"presets": ["react-app"],
"plugins": ["transform-es2015-modules-commonjs"]
}
LOL
cat <<WOW > index.html
<!doctype html>
<title>Welcome to $name</title>
<div id="root"></div>
<script src="./src/index.js"></script>
WOW
mkdir src
cat <<OK > src/index.js
import React from 'react'
import {render} from 'react-dom'
import App from './app'
const root = document.getElementById('root')
render(<App />, root)
OK
cat <<APP > src/app.js
import React, {PureComponent} from 'react'
export default class App extends PureComponent {
render () {
return (
<div>Welcome to $name</div>
)
}
}
APP
@davidnagli
Copy link

davidnagli commented Dec 8, 2017

What does "LOL", "WOW", and "OK" do? I'm not very familiar with bash, so I'm curious to know what you're using them for 😂

@hhsnopek
Copy link

hhsnopek commented Dec 8, 2017

@davidnagli that's Unix "Here document". Basically it's taking the text block between OK for example and appends it to src/index.js

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment