Skip to content
This repository was archived by the owner on Jun 1, 2020. It is now read-only.

Commit 52e6c58

Browse files
authored
Merge pull request #19 from Rulox/develop
Update Readme
2 parents da0bd70 + 0f977cb commit 52e6c58

File tree

2 files changed

+26
-3
lines changed

2 files changed

+26
-3
lines changed

README.md

Lines changed: 23 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -89,8 +89,14 @@ them in order to do your own app!
8989
* Home
9090
* About
9191

92-
## Folder structure and explanation
93-
WIP
92+
## Creating your own component
93+
94+
To create a new component, just create a new folder in the atoms/molecules/organisms/templates folder with the
95+
name of your component.
96+
97+
Create now the React component in the js file. Also create your .scss file and remember to import it in the _style.scss
98+
of the parent folder (For example, if you're creating a new atom called Checkbox, you should have `atoms/Checkbox/_style.scss`. So in
99+
the main style file for atoms `atoms/_style.scss` just import your new scss file so it can be imported.
94100

95101
## NPM Scripts
96102
This project comes with the following scripts to help you.
@@ -102,5 +108,20 @@ npm run start
102108
2. Launch a browsersync web server and open default browser.
103109
3. Launch watchers on JS/CSS files.
104110

111+
```bash
112+
npm run build-dev
113+
```
114+
1. Build CSS and JS from sources but does not start browsersync server.
115+
116+
```bash
117+
npm run js-lint
118+
```
119+
1. Launch JS Lint checker.
120+
121+
```bash
122+
npm run sass-lint
123+
```
124+
1. Launch SASS Lint checker.
125+
105126
## Contributions
106127
Feel free to create a pull request or create an issue to add features or fix bugs.

package.json

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,9 @@
44
"description": "Basic Structure for React app following Atomic Design",
55
"scripts": {
66
"start": "gulp",
7-
"js-lint": "gulp jslint"
7+
"build-dev": "gulp js && gulp sass",
8+
"js-lint": "gulp jslint",
9+
"sass-lint": "gulp stylelint"
810
},
911
"repository": {
1012
"type": "git",

0 commit comments

Comments
 (0)