npm init -y
Create a folder called src and add an empty index.js file. The code that webpack compiles goes in here including any Javascript modules and the main Tailwind file.
If you're developing an application based on React it can be helpful if you don't need to develop all the basic UI components yourself. Here you can find a list with various components, component libraries and complete design systems developed with and for React.
As the list got longer and longer I thought it would be better to have a "real" site for it.
{ | |
"emojis": [ | |
{"emoji": "👩👩👧👧", "name": "family: woman, woman, girl, girl", "shortname": ":woman_woman_girl_girl:", "unicode": "1F469 200D 1F469 200D 1F467 200D 1F467", "html": "👩‍👩‍👧‍👧", "category": "People & Body (family)", "order": ""}, | |
{"emoji": "👩👩👧👦", "name": "family: woman, woman, girl, boy", "shortname": ":woman_woman_girl_boy:", "unicode": "1F469 200D 1F469 200D 1F467 200D 1F466", "html": "👩‍👩‍👧‍👦", "category": "People & Body (family)", "order": ""}, | |
{"emoji": "👩👩👦👦", "name": "family: woman, woman, boy, boy", "shortname": ":woman_woman_boy_boy:", "unicode": "1F469 200D 1F469 200D 1F466 200D 1F466", "html": "👩‍👩‍👦‍👦", "category": "People & Body (family)", "order": ""}, | |
{"emoji": "👨👩👧👧", "name": "family: man, woman, girl, girl", "shortname": ":man_woman_girl_girl:", "unicode": "1F468 200D 1F469 200D 1F467 200D 1F467", "html": "👨‍👩&z |
// npm install --save scrollreveal or install like you're used to doing it. | |
// It doesn't work well if there are multiple instances of ScrollReveal, | |
// so we have to create a module returning an instance: | |
// file ScrollReveal.js: | |
import ScrollReveal from 'scrollreveal' | |
export default ScrollReveal() | |
// Then in a component: | |
import React from 'react' | |
import sr from './ScrollReveal' |
{ | |
"remove-empty-rulesets": true, | |
"always-semicolon": true, | |
"color-case": "lower", | |
"block-indent": " ", | |
"color-shorthand": true, | |
"element-case": "lower", | |
"leading-zero": true, | |
"sort-order-fallback": "abc", | |
"space-before-colon": "", |
/* | |
This .scss loop will create "margin helpers" and "padding helpers" for use in your web projects. | |
It will generate several classes such as: | |
.m-r-10 which gives margin-right 10 pixels. | |
.m-r-15 gives MARGIN to the RIGHT 15 pixels. | |
.m-t-15 gives MARGIN to the TOP 15 pixels and so on. | |
.p-b-5 gives PADDING to the BOTTOM of 5 pixels | |
.p-l-40 gives PADDING to the LEFT of 40 pixels |
npm rebuild node-sass |