-
Notifications
You must be signed in to change notification settings - Fork 1
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Added development setup notes to README #47
Merged
Changes from 1 commit
Commits
Show all changes
2 commits
Select commit
Hold shift + click to select a range
File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,2 +1,51 @@ | ||
# DrawMyLife-Website | ||
A website showcasing the Draw My Life initiative, partnerships and team | ||
A static website showcasing the Draw My Life initiative, partnerships and team | ||
|
||
## Development Setup | ||
This website lives and is rendered on the client side. To get up and running with the development of this project there are a few prerequisite, i.e. you need to have node and Ruby installed on your local machine. | ||
|
||
### Why do I need Node and Ruby installed? | ||
Ruby is required for Jekyll and Node will help you massively with all the javascript (see Tech Stack for more details). | ||
|
||
### Tech Stack | ||
| React | Jekyll | | ||
| :-----------: |:-------------:| | ||
| Webpack | Yarn | | ||
|
||
##### Please note that all Javascript is written in ECMAScript2015 (ES6). | ||
|
||
### How to install the Stack and all the dependencies | ||
As mentioned in the Development setup intro there are some prerequisites required before you can begin work on the project. | ||
|
||
#### Jekyll | ||
_{ installation instructions to go here }_ | ||
|
||
#### Yarn | ||
Yarn is a javascript package management for all dependencies. It will be used to add and remove all javascript dependencies from this project. | ||
|
||
- You'll need to have [Yarn](https://yarnpkg.com/en/docs/install) installed globally on your local machine. This can be installed via [homebrew](http://brew.sh/) | ||
- To install all the dependencies for this project you will need to `yarn install` on the command line | ||
- To add a dependency `yarn add {dependency}` on the command line. | ||
- If it's a development dependency add the flag `--dev`. Example `yarn add {dependency} --dev` to save to the `package.json` | ||
- If it's a production dependency add the flag `--save`. Example `yarn add {dependency} --save` to save to the `package.json` | ||
|
||
##### React and Webpack are dependencies and will be installed during the installation of all javascript dependencies, i.e. `yarn install` | ||
|
||
### Building the project | ||
It's probably best to have two terminal tabs open, as you will need to build and transpile your React components; and then Jekyll will serve it to your local host. | ||
|
||
#### Building the React Components | ||
To build and tranpile the React Components you will need to run the command `webpack` in your command line | ||
|
||
#### Serving the project to your local host | ||
To build and serve the entire project so you can see local changes you will need to run the command `jekyll serve` in the command line and visit `http://localhost:4000` to see the changes. | ||
|
||
### Linting | ||
To ensure we have less error prone code we are using two linting dependencies to highlight any errors as we code: `eslint` and `sass-lint`. It is recommended that you also get a local linters for your IDE or text editor. | ||
|
||
*Example of Linters* | ||
|
||
| | Atom | Sublime | | ||
| :--------- |:--------------------------------------------------------------| :---------------------- | | ||
| ESLint | [Atom ESLint](https://atom.io/packages/eslint) | {I need to find one 😂} | | ||
| SASS-Lint | [linter-sass-lint](https://atom.io/packages/linter-sass-lint) | {See above} | |
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Does 'prerequisite' need to be plural? It reads like it should be.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Feel free to add the
s
mate 😜