Skip to content

Commit 0ff216a

Browse files
clintonwooclintonwoo
committed
Starting the project, just about to delete Graphql.js schema code in favor of Apollo graphql-tools implementation. Committing to save old code. graphql-tools implementation lets you write GraphQL syntax which actually ends up being easier to read and formulate GraphQL queries. Resolvers can also be split from the graphQL and it turns out to give better separation of concerns.
0 parents  commit 0ff216a

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

74 files changed

+10569
-0
lines changed

‎.babelrc

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
{
2+
"presets": [
3+
[
4+
"env",
5+
{
6+
"targets": {
7+
"node": "current",
8+
"browsers": ["last 2 versions"]
9+
},
10+
}],
11+
"stage-0", // Unstable and unrecommended, especially below stage 3
12+
"react"
13+
]
14+
}

‎.eslintrc

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
{
2+
"extends" : "airbnb",
3+
"parser": "babel-eslint",
4+
"rules": {
5+
no-plusplus: 2,
6+
"jsx-a11y/href-no-hash": ["off"],
7+
"react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }]
8+
},
9+
"env": {
10+
"jest": true
11+
}
12+
}
13+

‎.flowconfig

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
[ignore]
2+
.*/node_modules/.*
3+
4+
[include]
5+
./src/
6+
7+
[libs]
8+
9+
[options]
10+

‎.gitignore

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
.DS_Store
2+
node_modules
3+
npm-debug.log
4+
logs
5+
build/.next
6+
build/static

‎README.md

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
Hacker News Clone
2+
3+
React (UI Framework)
4+
Next.js (Routing, SSR, Hot Module Reloading, Code Splitting, Build tool uses Webpack)
5+
Apollo (GraphQL Client)
6+
Redux (State Management)
7+
GraphQL (Web Data API)
8+
Express (Web App Server)
9+
Node.js (Web Server)
10+
Jest (Tests)
11+
Bulma (CSS Framework)
12+
13+
How To Start
14+
15+
npm install
16+
npm run dev
17+
18+
How To Test
19+
20+
npm run jest
21+
22+
How To Deploy
23+
24+
npm run build
25+
npm run deploy
26+
27+
Contributing
28+
29+
License
30+
31+
Credits
32+

‎build/README.md

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
Project build scripts populate this directory for deployment.

‎package.json

+61
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
{
2+
"name": "hackernews",
3+
"version": "0.1.0",
4+
"description": "A hacker news clone built from the ground up to demonstrate React and GraphQL",
5+
"main": "index.js",
6+
"scripts": {
7+
"dev": "babel-node src/server.js",
8+
"graphiql": "babel-node ./src/data/graphiql",
9+
"test": "jest",
10+
"build": "yarn install && next build src && next export src -o build/static",
11+
"prod": "next build src && next start src",
12+
"deploy": ""
13+
},
14+
"keywords": [
15+
"hacker-news",
16+
"clone",
17+
"react",
18+
"graphql"
19+
],
20+
"author": "Clinton D'Annolfo",
21+
"license": "GPL-3.0",
22+
"dependencies": {
23+
"babel-runtime": "^6.26.0",
24+
"express": "^4.15.4",
25+
"express-graphql": "^0.6.7",
26+
"graphql": "^0.10.5",
27+
"graphql-tools": "^1.2.1",
28+
"next": "^3.0.6",
29+
"passport": "^0.4.0",
30+
"prop-types": "^15.5.10",
31+
"react": "^15.6.1",
32+
"react-apollo": "^1.4.14",
33+
"react-dom": "^15.6.1",
34+
"react-redux": "^5.0.6",
35+
"url": "^0.11.0"
36+
},
37+
"devDependencies": {
38+
"babel-cli": "^6.26.0",
39+
"babel-core": "^6.26.0",
40+
"babel-eslint": "^7.2.3",
41+
"babel-jest": "^20.0.3",
42+
"babel-loader": "^7.1.2",
43+
"babel-preset-env": "^1.6.0",
44+
"babel-preset-react": "^6.24.1",
45+
"babel-preset-stage-0": "^6.24.1",
46+
"enzyme": "^2.9.1",
47+
"eslint": "^4.5.0",
48+
"eslint-config-airbnb": "^15.1.0",
49+
"eslint-plugin-import": "^2.7.0",
50+
"eslint-plugin-jsx-a11y": "^6.0.2",
51+
"eslint-plugin-react": "^7.2.1",
52+
"flow-bin": "^0.53.1",
53+
"graphiql": "^0.11.2",
54+
"isomorphic-fetch": "^2.2.1",
55+
"jest": "^20.0.4",
56+
"jest-enzyme": "^3.8.0",
57+
"react-test-renderer": "^15.6.1",
58+
"webpack": "^3.5.5",
59+
"webpack-dev-server": "^2.7.1"
60+
}
61+
}

‎src/__tests__/__snapshots__/App.js.snap

+67
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`App Component App matches it's empty snapshot 1`] = `<div />`;
4+
5+
exports[`App Component shallow renders 1`] = `
6+
ShallowWrapper {
7+
"complexSelector": ComplexSelector {
8+
"buildPredicate": [Function],
9+
"childrenOfNode": [Function],
10+
"findWhereUnwrapped": [Function],
11+
},
12+
"length": 1,
13+
"node": <div />,
14+
"nodes": Array [
15+
<div />,
16+
],
17+
"options": Object {},
18+
"renderer": ReactShallowRenderer {
19+
"_instance": ShallowComponentWrapper {
20+
"_calledComponentWillUnmount": false,
21+
"_compositeType": 2,
22+
"_context": Object {},
23+
"_currentElement": <App />,
24+
"_debugID": 3,
25+
"_hostContainerInfo": null,
26+
"_hostParent": null,
27+
"_instance": StatelessComponent {
28+
"_reactInternalInstance": [Circular],
29+
"context": Object {},
30+
"props": Object {},
31+
"refs": Object {},
32+
"state": null,
33+
"updater": Object {
34+
"enqueueCallback": [Function],
35+
"enqueueCallbackInternal": [Function],
36+
"enqueueElementInternal": [Function],
37+
"enqueueForceUpdate": [Function],
38+
"enqueueReplaceState": [Function],
39+
"enqueueSetState": [Function],
40+
"isMounted": [Function],
41+
"validateCallback": [Function],
42+
},
43+
},
44+
"_mountOrder": 1,
45+
"_pendingCallbacks": null,
46+
"_pendingElement": null,
47+
"_pendingForceUpdate": false,
48+
"_pendingReplaceState": false,
49+
"_pendingStateQueue": null,
50+
"_renderedComponent": NoopInternalComponent {
51+
"_currentElement": <div />,
52+
"_debugID": 4,
53+
"_renderedOutput": <div />,
54+
},
55+
"_renderedNodeType": 0,
56+
"_rootNodeID": 0,
57+
"_topLevelWrapper": null,
58+
"_updateBatchNumber": null,
59+
"_warnedAboutRefsInRender": false,
60+
},
61+
"getRenderOutput": [Function],
62+
"render": [Function],
63+
},
64+
"root": [Circular],
65+
"unrendered": <App />,
66+
}
67+
`;

‎src/__tests__/server.js

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import app from '../server';
2+
3+
describe('Web server', () => {
4+
// it('shallow renders', () => {
5+
// const wrapper = shallow(
6+
// <NewsFeed />,
7+
// );
8+
// expect(wrapper).toMatchSnapshot();
9+
// });
10+
it('exists', () => {
11+
expect(app).toBeDefined();
12+
});
13+
});

‎src/components/Comment.js

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import React from 'react';
2+
3+
4+
const Component = props => (
5+
<div>
6+
{}
7+
</div>
8+
);
9+
10+
export default Component;

‎src/components/CommentBox.js

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import React from 'react';
2+
3+
4+
const Component = props => (
5+
<div>
6+
{}
7+
</div>
8+
);
9+
10+
export default Component;

‎src/components/Component.js

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import React from 'react';
2+
3+
4+
const Component = props => (
5+
<div>
6+
{props.children && props.children}
7+
</div>
8+
);
9+
10+
export default Component;

‎src/components/Footer.js

+36
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
import React from 'react';
2+
3+
4+
const Footer = props => (
5+
<tr>
6+
<td style={{ padding: '0px' }}>
7+
<img src="/static/s.gif" height="10" width="0" />
8+
<table style={{ height: '2px', width: '100%', borderSpacing: '0px', /*borderCollapse: 'collapse'*/ }}>
9+
<tbody>
10+
<tr>
11+
<td style={{ backgroundColor: '#ff6600' }} />
12+
</tr>
13+
</tbody>
14+
</table>
15+
<br />
16+
<center>
17+
<span className="yclinks"><a href="/newsguidelines">Guidelines</a>
18+
&nbsp;| <a href="/newsfaq">FAQ</a>
19+
&nbsp;| <a href="mailto:[email protected]">Support</a>
20+
&nbsp;| <a href="https://github.com/HackerNews/API">API</a>
21+
&nbsp;| <a href="/security">Security</a>
22+
&nbsp;| <a href="/lists">Lists</a>
23+
&nbsp;| <a href="/bookmarklet">Bookmarklet</a>
24+
&nbsp;| <a href="/dmca">DMCA</a>
25+
&nbsp;| <a href="http://www.ycombinator.com/apply/">Apply to YC</a>
26+
&nbsp;| <a href="mailto:[email protected]">Contact</a></span>
27+
<br />
28+
<br />
29+
<form method="get" action="//hn.algolia.com/" style={{ marginBottom: '1em' }} >Search:
30+
<input type="text" name="q" value="" size="17" autoCorrect="off" spellCheck="false" autoCapitalize="off" autoComplete="false" /></form>
31+
</center>
32+
</td>
33+
</tr>
34+
);
35+
36+
export default Footer;

‎src/components/Header.js

+47
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
import React from 'react';
2+
import PropTypes from 'prop-types';
3+
4+
import HeaderNav from './HeaderNav';
5+
6+
7+
const Header = props => (
8+
<tr>
9+
<td style={{ backgroundColor: '#ff6600', padding: '0px' }} >
10+
<table style={{ border: '0px', padding: '2px', /*borderCollapse: 'collapse',*/ borderSpacing: '0px', width: '100%' }}>
11+
<tbody>
12+
<tr>
13+
<td style={{ width: '18px', padding: '0px', paddingRight: '4px' }}>
14+
<a href="/">
15+
<img src="/static/y18.gif" style={{ width: '18px', height: '18px', border: '1px', borderColor: 'white', borderStyle: 'solid' }} />
16+
</a>
17+
</td>
18+
<td style={{ lineHeight: '12px', height: '10px', padding: '0px' }}>
19+
<HeaderNav {...props} />
20+
</td>
21+
{
22+
props.isUserVisible &&
23+
<td style={{ textAlign: 'right', padding: '0px', paddingRight: '4px' }}>
24+
<span className="pagetop">
25+
<a href="/user?id=clintonwoo">clintonwoo</a>
26+
{' (1) | '}
27+
<a href="/logout?auth=d78ccc2c6120ffe08f32451519c2ff46d34c51ab&amp;goto=news">logout</a>
28+
</span>
29+
</td>
30+
}
31+
</tr>
32+
</tbody>
33+
</table>
34+
</td>
35+
</tr>
36+
);
37+
Header.defaultProps = {
38+
userId: null,
39+
};
40+
Header.propTypes = {
41+
userId: PropTypes.string,
42+
isNavVisible: PropTypes.bool.isRequired,
43+
isUserVisible: PropTypes.bool.isRequired,
44+
title: PropTypes.string.isRequired,
45+
};
46+
47+
export default Header;

‎src/components/HeaderNav.js

+45
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
import React from 'react';
2+
import PropTypes from 'prop-types';
3+
4+
5+
const HeaderNav = props => (
6+
// const threads = <span> | </span><a href="/threads?id=clintonwoo">threads</a>;
7+
props.isNavVisible ?
8+
<span className="pagetop">
9+
<b className="hnname">
10+
<a href="news">{props.title}</a>
11+
</b>
12+
&nbsp;
13+
{props.userId && <a href="/newswelcome">welcome</a>}
14+
{props.userId && ' | '}
15+
<a href="/newest">new</a>
16+
{props.userId && ' | '}
17+
{props.userId && <a href={`/threads?id=${props.userId}`}>threads</a>}
18+
{' | '}
19+
<a href="/newcomments">comments</a>
20+
{' | '}
21+
<a href="/show">show</a>
22+
{' | '}
23+
<a href="/ask">ask</a>
24+
{' | '}
25+
<a href="/jobs">jobs</a>
26+
{' | '}
27+
<a href="/submit">submit</a>
28+
</span>
29+
:
30+
<span className="pagetop">
31+
<b className="hnname">
32+
<a href="news">{props.title}</a>
33+
</b>
34+
</span>
35+
);
36+
HeaderNav.defaultProps = {
37+
userId: null,
38+
};
39+
HeaderNav.propTypes = {
40+
userId: PropTypes.string,
41+
isNavVisible: PropTypes.bool.isRequired,
42+
title: PropTypes.string.isRequired,
43+
};
44+
45+
export default HeaderNav;

0 commit comments

Comments
 (0)