For a details list of all the desired features refer to this discussion
-
Install
npm
Ubuntu\Debian:sudo apt install npm
Arch:sudo pacman -S npm
-
Install Gatsby
sudo npm install gatsby
-
clone this repository
git clone https://github.com/istenith/website2020-21.git
-
cd website2020-21
-
Install all the dependencies
npm install
-
Run a Development server
gatsby develop
the server runs on port:8000 access it from your browser at:https:\\localhost:8000
for GraphQl editor:https:\\localhost:8000\__graphql
|-- LICENSE
|-- README.md
|-- content ------>this folder contains the .md files
| |-- about.md
| |-- media
| | |-- horses.jpg
| | `-- meme.jpg
| `-- projects
| |-- graphics-card.md
| `-- lost-lander.md
|-- gatsby-browser.js
|-- gatsby-config.js ------>main Gatsby config file define ur plugins here
|-- gatsby-node.js ------>Gatsby Node API for making slugs and linking Templates
|-- gatsby-ssr.js
|-- package-lock.json
|-- package.json
`-- src
|-- components ------>Folder to contain all the react components
| |-- header.js
| |-- header.module.scss
| |-- layout.js
| |-- projects.js
| `-- seo.js
|-- images ------>For images to be used in the website
| `-- iste-logo-blue.png
|-- pages ------>Put all the pages you define here
| |-- 404.js
| |-- index.js
| `-- page-2.js
|-- templates ------>Template for rendering the .md files
| `-- project.js
`-- utils ------>Typography library settings
`-- typography.js
Fork this repository and clone it as mentioned above
Create a new branch whenever you want to add a new feature and file a PR from that branch only. If the PR is accepted then delete that from locally and rebase your master branch with upstream:
in the master branch:
git pull upstream --rebase master
The project is currently set up to support both CSS ans SASS. It is strongly recommended to use SASS always. Use inline styling fot components if you can get away with it but feel free to make a separate SASS module and import it into your component. Try not to duplicate the style properties use the power of inheritance!
Typography.js takes care of the fonts throughout the website see src/utils/typography.js
. Predefined themes are also available for moe information refer to the docs!
I have not encountered any major error till now except this one
Internal watch failed: ENOSPC: System limit for number of file watchers reached
Fix: sudo echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p
Since this occurred fairly often I made an alias for this in my .zshrc
The Official Gatsby Documentation is the best resource for getting started with Gatsby and understand the basics.