npm init -y to init a package.json with some default values

yarn add -D @11ty/eleventy @netlify/functions tailwindcss node-fetch dotenv npm-run-all

Setup our scripts

"scripts": {
	"dev:css": "npx tailwindcss -i src/styles.css -o dist/styles.css -w",
	"dev:11ty": "eleventy --config=_eleventy/config.js --serve --watch",
  "dev": "node_modules/.bin/run-p dev:*",
  "build:css": "NODE_ENV=production npx tailwindcss -i src/styles.css -o dist/styles.css -m",
  "build:11ty": "eleventy --config=_eleventy/config.js --output=dist",
  "build": "node_modules/.bin/run-s build:*"
}

<aside> 💡 node_modules/.bin/run-p is shorthand for npm-run-all -p

Run given npm-scripts in parallel (in this case anything with build in the command)

</aside>

<aside> 💡 node_modules/.bin/run-s is shorthand for npm-run-all -s

Run given npm-scripts sequentially. (in this case all the scripts with dev in the command)

</aside>

create some files and folders

1. Create an _eleventy folder with a config.js file to hold the 11ty configuration

   1. We’ll also need to make sure we alias this in our scripts so 11ty knows where to look

2. netlify.toml for all of our netlify configs (serverless functions / redirects / etc)

3. src to capture all of our client code

4. src/_includes which will store all of our client code for pages / components / layouts / etc

5. src/_data handles all of our data fetching needs to pump into pages

   

6. Create our styles.css inside of our src folder

7. Create the netlify directory with a functions folder on the inside to hold our serverless functions

8. Create a tailwind.config.js file to put our tailwind setup inside of