Skip to content

Commit c95f5a1

Browse files
outlandnishoutlandnish
committed
0 parents  commit c95f5a1

22 files changed

+12751
-0
lines changed

‎.gitignore

+70
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
8+
# Runtime data
9+
pids
10+
*.pid
11+
*.seed
12+
*.pid.lock
13+
14+
# Directory for instrumented libs generated by jscoverage/JSCover
15+
lib-cov
16+
17+
# Coverage directory used by tools like istanbul
18+
coverage
19+
20+
# nyc test coverage
21+
.nyc_output
22+
23+
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
24+
.grunt
25+
26+
# Bower dependency directory (https://bower.io/)
27+
bower_components
28+
29+
# node-waf configuration
30+
.lock-wscript
31+
32+
# Compiled binary addons (http://nodejs.org/api/addons.html)
33+
build/Release
34+
35+
# Dependency directories
36+
node_modules/
37+
jspm_packages/
38+
39+
# Typescript v1 declaration files
40+
typings/
41+
42+
# Optional npm cache directory
43+
.npm
44+
45+
# Optional eslint cache
46+
.eslintcache
47+
48+
# Optional REPL history
49+
.node_repl_history
50+
51+
# Output of 'npm pack'
52+
*.tgz
53+
54+
# dotenv environment variables file
55+
.env
56+
57+
# gatsby files
58+
.cache/
59+
public
60+
61+
# Mac files
62+
.DS_Store
63+
64+
# Yarn
65+
yarn-error.log
66+
.pnp/
67+
.pnp.js
68+
# Yarn Integrity file
69+
.yarn-integrity
70+

‎LICENSE

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
The MIT License (MIT)
2+
3+
Copyright (c) 2018 Aman Mittal
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.
22+

‎README.md

+72
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
# Gatsby Bulma Quickstart
2+
3+
> A Quick Way to bootstrap your next Gatsby + Bulma site.
4+
5+
![ss](https://i.imgur.com/Vz81GEl.png)
6+
7+
## Demo 💯
8+
9+
- [Demo Link](https://tender-raman-99e09b.netlify.com/)
10+
11+
## Features 🚀
12+
13+
- Gatsby v2
14+
- Bulma CSS
15+
- Responsive design
16+
- Google Analytics
17+
- SEO
18+
- Netlify Deployment
19+
20+
## Languages and Frameworks ⚛️
21+
22+
- Gatsby
23+
- Bulma
24+
- SASS
25+
- GraphQL
26+
27+
## How to use it? 👨‍💻
28+
29+
You need npm and Gatsby CLI installed on your development machine.
30+
31+
### 1. Clone the repository/Installation
32+
33+
If you have Git installed on your system you can run the following command:
34+
35+
`git clone https://github.com/amandeepmittal/gatsby-bulma-quickstart.git`
36+
37+
Otherwise you can directly download it clicking on download button on this repository.
38+
39+
### 2. Running in development mode
40+
41+
Go inside `gatsby-bulma-quickstart/` directory and run the following command:
42+
43+
`npm run develop`
44+
45+
### 3. Open the source code and start editing!
46+
47+
The site is now running at
48+
[http://localhost:8000](http://localhost:8000).
49+
50+
Open `gatsby-bulma-quickstart/` directory in your code editor of choice and edit it. Save your changes and the browser will update them in real time!
51+
52+
### 4. Add your own Google Analytics Id
53+
54+
Once you have google-analytics tracking id for your site, you can configure in `gatsby-config.js` file:
55+
56+
```js
57+
resolve: `gatsby-plugin-google-analytics`,
58+
options: {
59+
// Your Tracking Id 👇
60+
trackingId: 'UA-XXXXXXXX-X',
61+
anonymize: true
62+
}
63+
}
64+
```
65+
66+
## Contact me
67+
68+
If you find any possible improvement or suggestion related to code or UI/UX please contribute by submitting a PR.
69+
70+
You can also back or support this project for me to keep it updated by [**Buying Me a Coffee**](https://www.paypal.me/amanhimself/2)
71+
72+
**Happy Coding!** 🎉🎉

‎gatsby-browser.js

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
/**
2+
* Implement Gatsby's Browser APIs in this file.
3+
*
4+
* See: https://www.gatsbyjs.org/docs/browser-apis/
5+
*/
6+
7+
// You can delete this file if you're not using it

‎gatsby-config.js

+53
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
module.exports = {
2+
siteMetadata: {
3+
title: 'Gatsby Bulma Quickstart',
4+
author: 'Aman Mittal',
5+
imageUrl: 'https://i.imgur.com/Vz81GEl.png',
6+
description: 'A Project to bootstrap your next Gatsby + Bulma site.',
7+
keywords: `Web developer, Web, Developer, CSS, HTML, JS, Javascript, Gatsby, Bulma Developer, CSS3, HTML5, Seo, Starter`,
8+
twitter: 'https://twitter.com/amanhimself',
9+
github: `https://github.com/amandeepmittal`,
10+
medium: 'https://medium.com/@amanhimself',
11+
gatsby: 'https://www.gatsbyjs.org/',
12+
bulma: 'https://bulma.io/',
13+
siteUrl: `https://www.example.com`
14+
},
15+
plugins: [
16+
'gatsby-plugin-react-helmet',
17+
{
18+
resolve: `gatsby-source-filesystem`,
19+
options: {
20+
name: `images`,
21+
path: `${__dirname}/src/images`
22+
}
23+
},
24+
'gatsby-transformer-sharp',
25+
'gatsby-plugin-sharp',
26+
{
27+
resolve: `gatsby-plugin-manifest`,
28+
options: {
29+
name: 'Makefolio',
30+
short_name: 'Makefolio',
31+
start_url: '/',
32+
background_color: '#2980b9',
33+
theme_color: '#2980b9',
34+
display: 'standalone',
35+
icon: 'src/images/gatsby-icon.png',
36+
orientation: 'portrait'
37+
}
38+
},
39+
`gatsby-plugin-sass`,
40+
{
41+
resolve: `gatsby-plugin-google-analytics`,
42+
options: {
43+
trackingId: 'UA-XXXXXXXX-X',
44+
// Setting this parameter is optional (requried for some countries such as Germany)
45+
anonymize: true
46+
}
47+
},
48+
`gatsby-plugin-sitemap`
49+
// this (optional) plugin enables Progressive Web App + Offline functionality
50+
// To learn more, visit: https://gatsby.app/offline
51+
// 'gatsby-plugin-offline',
52+
]
53+
};

‎package.json

+47
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
{
2+
"name": "gatsby-bulma-quickstart",
3+
"description": "A Project to bootstrap your next Gatsby + Bulma site.",
4+
"version": "1.5.2",
5+
"author": "Aman Mittal <[email protected]>",
6+
"dependencies": {
7+
"bulma": "^0.7.4",
8+
"gatsby": "^2.3.25",
9+
"gatsby-image": "^2.0.39",
10+
"gatsby-plugin-google-analytics": "^2.0.18",
11+
"gatsby-plugin-manifest": "^2.0.29",
12+
"gatsby-plugin-offline": "^2.0.25",
13+
"gatsby-plugin-react-helmet": "^3.0.12",
14+
"gatsby-plugin-sass": "^2.0.11",
15+
"gatsby-plugin-sharp": "^2.0.35",
16+
"gatsby-plugin-sitemap": "^2.0.12",
17+
"gatsby-source-filesystem": "^2.0.29",
18+
"gatsby-transformer-sharp": "^2.1.18",
19+
"node-sass": "^4.11.0",
20+
"react": "^16.8.6",
21+
"react-dom": "^16.8.6",
22+
"react-helmet": "^5.2.0",
23+
"react-icons": "^3.6.1"
24+
},
25+
"keywords": [
26+
"gatsby",
27+
"bulma",
28+
"starter",
29+
"kit",
30+
"template"
31+
],
32+
"license": "MIT",
33+
"scripts": {
34+
"build": "gatsby build",
35+
"develop": "gatsby develop",
36+
"start": "npm run develop",
37+
"format": "prettier --write \"src/**/*.js\"",
38+
"test": "echo \"Error: no test specified\" && exit 1"
39+
},
40+
"devDependencies": {
41+
"prettier": "^1.14.2"
42+
},
43+
"repository": {
44+
"type": "git",
45+
"url": "https://github.com/amandeepmittal/gatsby-bulma-quickstart"
46+
}
47+
}

‎src/components/emoji.js

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import React from 'react';
2+
3+
export default props => {
4+
const styles = {
5+
fontSize: props.size + 'rem'
6+
};
7+
8+
return (
9+
<span style={styles} role="img" aria-label="emoji">
10+
{props.emoji}
11+
</span>
12+
);
13+
};

‎src/components/footer.js

+66
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
import React from 'react';
2+
import { FaTwitter, FaGithub, FaMedium } from 'react-icons/fa';
3+
import { StaticQuery, graphql } from 'gatsby';
4+
import './style.scss';
5+
import Emoji from './emoji';
6+
7+
const Footer = () => (
8+
<StaticQuery
9+
query={graphql`
10+
query SocialQuery {
11+
site {
12+
siteMetadata {
13+
gatsby
14+
bulma
15+
twitter
16+
medium
17+
github
18+
}
19+
}
20+
}
21+
`}
22+
render={data => (
23+
<footer className="footer center has-background-light">
24+
<div className="content has-text-centered">
25+
<p className="is-size-4">
26+
This website was handcrafted with plenty cups of{' '}
27+
<Emoji emoji="☕" />
28+
</p>
29+
<p className="is-size-4">
30+
By Aman Mittal (@amahimself) using{' '}
31+
<a href={data.site.siteMetadata.gatsby}>Gatsby</a> +{' '}
32+
<a href={data.site.siteMetadata.bulma}>Bulma</a>
33+
</p>
34+
<article className="media center">
35+
<span className="icon">
36+
<a href={data.site.siteMetadata.twitter}>
37+
<FaTwitter size="fa-2x" color="blue" />
38+
</a>
39+
</span>
40+
&nbsp;
41+
<span className="icon">
42+
<a href={data.site.siteMetadata.github}>
43+
<FaGithub size="fa-2x" color="black" />
44+
</a>
45+
</span>
46+
&nbsp;
47+
<span className="icon">
48+
<a href={data.site.siteMetadata.medium}>
49+
<FaMedium size="fa-2x" color="green" />
50+
</a>
51+
</span>
52+
&nbsp;
53+
</article>
54+
&nbsp;
55+
<p className="is-size-5">
56+
You can also back or support this project for me to keep it updated
57+
by{' '}
58+
<a href="https://www.paypal.me/amanhimself/2">Buying Me a Coffee</a>
59+
</p>
60+
</div>
61+
</footer>
62+
)}
63+
/>
64+
);
65+
66+
export default Footer;

0 commit comments

Comments
 (0)