Skip to content

Commit 5b5f775

Browse files
suddisuddi
committed
Made the site extensible
1 parent 8db80fa commit 5b5f775

Some content is hidden

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

41 files changed

+387
-681
lines changed

‎.gitignore

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -52,6 +52,9 @@ jspm_packages
5252
# Yarn Integrity file
5353
.yarn-integrity
5454

55+
# Mac-specific file
56+
.DS_Store
57+
5558
# ------------------------------------------------------------------------------
5659
# CUSTOM
5760
# ------------------------------------------------------------------------------

‎README.md

Lines changed: 15 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -17,17 +17,27 @@ The site has been shown as demo React.js project on the following sites:
1717
* [react.rocks](https://react.rocks/example/JSON_Resume)
1818
* [爱前端](http://www.17shulihua.com/archives/404)
1919

20-
## Usage
20+
## Installation
2121

22-
To setup:
22+
````sh
23+
npm install
2324
````
24-
source ./setup.sh
2525

26-
npm install
26+
## Usage
27+
28+
To run `webpack-dev-server` for local environment:
2729

30+
````sh
2831
npm run bundle
2932

3033
npm start
3134
````
35+
You can view the site at `http://localhost:8081`.
36+
37+
To bundle for deployment:
38+
39+
````sh
40+
npm run bundle
41+
````
3242

33-
You can view the site at `http://localhost:8080` or view the live site at [suddi.github.io](https://suddi.github.io).
43+
You can view the live site at [suddi.io](https://suddi.io)

‎app/components/banner.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,9 @@ const Banner = React.createClass({
1414
return (
1515
<div className='row banner'>
1616
<div className='banner-text'>
17-
<h1 className='responsive-headline'>{this.props.basics.name}</h1>
17+
<h1 className='responsive-headline'>
18+
{this.props.basics.name}
19+
</h1>
1820
{/*
1921
<h3>{this.props.basics.summary}</h3>
2022
*/}

‎app/components/home.js

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,10 @@ const Loading = require('./loading');
1515
const Home = React.createClass({
1616
propTypes: {
1717
route: PropTypes.shape({
18-
resume: PropTypes.string.isRequired
18+
config: PropTypes.shape({
19+
resumePath: PropTypes.string.isRequired,
20+
navigation: PropTypes.object.isRequired
21+
}).isRequired
1922
}).isRequired
2023
},
2124

@@ -27,7 +30,7 @@ const Home = React.createClass({
2730

2831
componentDidMount: function () {
2932
return request
30-
.get(this.props.route.resume)
33+
.get(this.props.route.config.resumePath)
3134
.end(function (error, response) {
3235
return error ? error : this.setState({
3336
resume: response.body
@@ -39,7 +42,7 @@ const Home = React.createClass({
3942
return (
4043
<div>
4144
<Header>
42-
<Navigation/>
45+
<Navigation navigation={this.props.route.config.navigation}/>
4346
<Banner basics={this.state.resume.basics}/>
4447
<ScrollDown/>
4548
</Header>
@@ -49,7 +52,7 @@ const Home = React.createClass({
4952
education={this.state.resume.education}
5053
skills={this.state.resume.skills}
5154
languages={this.state.resume.languages}
52-
portfolio={this.state.resume.publications}
55+
portfolio={this.state.resume.projects}
5356
references={this.state.resume.references}/>
5457
</div>
5558
);

‎app/components/navigation/index.js

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,21 +3,25 @@
33
const React = require('react');
44

55
const Link = require('./link');
6-
const config = require('../../config');
6+
const ResumePropTypes = require('../../prop_types/resume');
77

88
const Navigation = React.createClass({
9+
propTypes: {
10+
navigation: ResumePropTypes.navigation
11+
},
12+
913
render: function () {
1014
return (
1115
<nav id='nav-wrap' className='opaque'>
1216
<a className='mobile-btn' href='#nav-wrap' title='Show navigation'>Show navigation</a>
1317
<a className='mobile-btn' href='#' title='Hide navigation'>Hide navigation</a>
1418
<ul id='nav' className='nav'>
15-
{Object.keys(config.navigation).map(function (navigationLink, index) {
16-
const navigationName = config.navigation[navigationLink];
19+
{Object.keys(this.props.navigation).map(function (navigationLink, index) {
20+
const navigationName = this.props.navigation[navigationLink];
1721
return (
1822
<Link key={index} link={navigationLink} name={navigationName}/>
1923
);
20-
})}
24+
}.bind(this))}
2125
</ul>
2226
</nav>
2327
);

‎app/components/section/about.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,6 @@ const About = React.createClass({
1010
},
1111

1212
render: function () {
13-
const summary = this.props.content.summary.split('\n');
1413
return (
1514
<section id='about'>
1615
<div className='row'>
@@ -19,7 +18,7 @@ const About = React.createClass({
1918
</div>
2019
<div className='ten columns main-col'>
2120
<h2>About Me</h2>
22-
{summary.map(function (content, index) {
21+
{this.props.content.summary.map(function (content, index) {
2322
return (
2423
<p key={index}>
2524
{content}

‎app/components/section/footer.js

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,14 @@ const Footer = React.createClass({
1818
<SocialMedia ulClass='social-links' profiles={this.props.content.profiles}/>
1919
<ul className='copyright'>
2020
<li>
21-
This site is developed in React.js from the original design of Ceevee from&nbsp;
21+
This site is developed in React.js by&nbsp;
22+
<a
23+
href='https://suddi.io'
24+
title='Sudharshan Ravindran'
25+
target='_blank'
26+
rel='noopener noreferrer'>
27+
Sudharshan Ravindran
28+
</a> from the original design of Ceevee from&nbsp;
2229
<a
2330
href='http://www.styleshout.com/'
2431
title='Styleshout'

‎app/components/section/modal.js

Lines changed: 6 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@ const PropTypes = React.PropTypes;
55

66
const ReactModal = require('react-modal');
77

8-
const config = require('../../config');
98
const ResumePropTypes = require('../../prop_types/resume');
109

1110
const Modal = React.createClass({
@@ -16,11 +15,6 @@ const Modal = React.createClass({
1615
},
1716

1817
render: function () {
19-
const parts = this.props.entry.name.split(':');
20-
const _name = parts[0];
21-
// const category = parts[1];
22-
const tools = parts[2];
23-
2418
const style = {
2519
overlay: {
2620
backgroundColor: 'rgba(0, 0, 0, 0.75)'
@@ -29,13 +23,16 @@ const Modal = React.createClass({
2923

3024
return (
3125
<ReactModal className='popup-modal mfp-hide' isOpen={this.props.isOpen} onRequestClose={this.props.onRequestClose} style={style}>
32-
<img className='scale-with-grid' src={config.portfolio.image[_name].modal} alt={_name}/>
26+
<img
27+
className='scale-with-grid'
28+
src={this.props.entry.image.modal}
29+
alt={this.props.entry.name}/>
3330
<div className='description-box'>
34-
<h5>{_name}</h5>
31+
<h5>{this.props.entry.name}</h5>
3532
<p>{this.props.entry.summary}</p>
3633
<span className='categories'>
3734
<i className='fa fa-tag'/>
38-
{tools}
35+
{this.props.entry.keywords.join(', ')}
3936
</span>
4037
</div>
4138
<div className='link-box'>

‎app/components/section/portfolio.js

Lines changed: 7 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -2,14 +2,13 @@
22

33
const React = require('react');
44

5-
const config = require('../../config');
65
const ResumePropTypes = require('../../prop_types/resume');
76
const Random = require('../../utils/random');
87
const Modal = require('./modal');
98

109
const Entry = React.createClass({
1110
propTypes: {
12-
entry: ResumePropTypes.publications
11+
entry: ResumePropTypes.projects
1312
},
1413

1514
getInitialState: function () {
@@ -31,20 +30,16 @@ const Entry = React.createClass({
3130
},
3231

3332
render: function () {
34-
const parts = this.props.entry.name.split(':');
35-
const _name = parts[0];
36-
const category = parts[1];
37-
// const tools = parts[2];
38-
// config.portfolio.image[_name].src
39-
4033
return (
4134
<div className='columns portfolio-item'>
4235
<div className='item-wrap' onClick={this.handleOpenModal}>
43-
<img src={config.portfolio.image[_name].thumb} alt={_name}/>
36+
<img
37+
src={this.props.entry.image.thumb}
38+
alt={this.props.entry.name}/>
4439
<div className='overlay'>
4540
<div className='portfolio-item-meta'>
46-
<h5>{_name}</h5>
47-
<p>{category}</p>
41+
<h5>{this.props.entry.name}</h5>
42+
<p>{this.props.entry.category}</p>
4843
</div>
4944
</div>
5045
<div className='link-icon'>
@@ -59,7 +54,7 @@ const Entry = React.createClass({
5954

6055
const Portfolio = React.createClass({
6156
propTypes: {
62-
content: ResumePropTypes.publicationsSet
57+
content: ResumePropTypes.projectsSet
6358
},
6459

6560
render: function () {

‎app/components/section/references.js

Lines changed: 2 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -12,20 +12,15 @@ const Entry = React.createClass({
1212
},
1313

1414
render: function () {
15-
const parts = this.props.entry.name.split(':');
16-
const _name = parts[0];
17-
const position = parts[1];
18-
const company = parts[2];
19-
2015
return (
2116
<div>
2217
<blockquote>
2318
<p>{this.props.entry.reference}</p>
2419
<cite>
25-
{_name}
20+
{this.props.entry.name}
2621
<br/>
2722
&nbsp;&nbsp;&nbsp;&nbsp;
28-
{position + ', ' + company}
23+
{this.props.entry.position + ', ' + this.props.entry.company}
2924
</cite>
3025
</blockquote>
3126
</div>

‎app/components/section/skills.js

Lines changed: 9 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -103,17 +103,6 @@ const Skills = React.createClass({
103103
},
104104

105105
render: function () {
106-
const programmingSummary = [
107-
'Worked primarily with JavaScript, Python and C++, with frameworks such as Express.js, Koa.js, React.js, Django and Flask.',
108-
'Interested in functional programming and serverless architectures, exploring with Erlang and AWS Lambda respectively.'
109-
];
110-
const databaseSummary = [
111-
'Experienced in both SQL and NoSQL, having worked in companies making use of DynamoDB, MongoDB, PostgreSQL and Aurora RDS flavour of MySQL, ' +
112-
'with personal further projects utilizing RethinkDB'
113-
];
114-
115-
const programmingSkills = filterSkills(this.props.content.skills, 'programming');
116-
const databaseSkills = filterSkills(this.props.content.skills, 'database');
117106
return (
118107
<section id='skill'>
119108
<div className='row skill'>
@@ -123,8 +112,15 @@ const Skills = React.createClass({
123112
</h1>
124113
</div>
125114
<div className='ten columns main-col'>
126-
<Skill title='Programming Languages' content={programmingSkills} summary={programmingSummary}/>
127-
<Skill title='Database Systems' content={databaseSkills} summary={databaseSummary}/>
115+
{this.props.content.skills.map(function (skill, index) {
116+
return (
117+
<Skill
118+
key={index}
119+
title={skill.title}
120+
content={skill.skillDetails}
121+
summary={skill.description}/>
122+
);
123+
})}
128124
{/*
129125
<Skill title='Languages' content={this.props.content.languages}/>
130126
*/}

‎app/config.js

Lines changed: 0 additions & 60 deletions
This file was deleted.

0 commit comments

Comments
 (0)