almost 6 years ago from Stephen Kempin, Front End Developer & Designer
Hey DN, I'm looking at rebuilding my portfolio using React, and am looking for inspiration! I know this has probably been asked many times before, but would love any examples of React based portfolio sites. Thanks
Why use React? I'd ask yourself what you want your portfolio to do rather than start with React and just build something.
The reason I say this is because if I'm looking for a developer with React skills I'd rather see an interesting project than a simple portfolio page with a few simple components. Maybe your portfolio page is an application?
Maybe its an exercise to learn how to use React?
This is exactly what it is - I need to build a new portfolio and learning React in the process is a bonus.
Because React makes it easier to reason about your webpage as a function of dynamic data (either coming in from Contentful or Firebase). It’s a better abstraction especially if you’re a designer or content creator.
You don’t want to be messing about with Jekyll’s liquid templating tags or Handlebars or string concatenation with jQuery when you can use JSX.
The upside is you can update your site without recompiling your code each and everytime, hook it up to external APIs, and with create-react-app you can host your site for free on Github, which is a major plus!
You can get all of that with a decent CMS (eg Craft) apart from the hosting on Github bit.
Yes, but then you’d lose the benefits of using JSX, which could be a matter of preference, but I feel it’s still a better way of reasoning about your website.
I’ve built things in vanilla HTML/CSS/jQuery, Jekyll, WordPress, and Webflow, and the React + Contentful combo provides the best developer experience, in my experience, because it matches how I think about this.
By all means, go for the technology that makes you the most productive. Even if it’s not the most comfortable (because of the learning curve) to you at first.
I don't know any individual artist portfolios built using React off the top of my head, but the fantastic game developers ustwo have a React-based site: https://ustwo.com/
The best part: it's open source https://github.com/ustwo/ustwo.com-frontend
I just finished my own portfolio, which I wrote in React: gavinanthony.com — Github.
I chose to not use anything like Gatsby.js, trying to keep it pretty simple. It's just react, react-router, and graph.cool for form submissions.
You might want to check out your portfolio on non-standard screen sizes. I get some pretty bad text overflow at 590px wide.
Hey thanks for the catch, I'll be checking that out. Just published it yesterday so it might be rough in a couple spots.
Nice work on the website, super clean and clear. I may even poke around your code trying to learn some react myself :)
Love this, great design!
I like this! You could code my site too :))) http://santifox.vision
Gonna pitch my personal react-written portfolio here: philkt.me
jon.gold & cortes.us are both built in react.
React is likely overkill for a portfolio, unless you're using it as a learning exercise. I suggest that you first determine your expectations, and create a design (or static version of your site).
Chances are, you'll be using React for just a fraction of what it's capable of - in such cases, writing your own JS is usually more fun and optimal.
put your mind to the content—what story do you want to tell, and how compelling it is—before choosing a technology.
Most likely React is overkill
I'd advise against unless you understand the fallbacks.
Biggest one being SEO/URL since you may not enable actual page refreshes or server-side rendering.
Most folks say "oh who cares about SEO!" Which is generally true but when none of your page actually changes it can have drastic effects on how your work proliferates throughout the web.
You could just create the project as an isomorphic react project, or if you're using this with some cms, you could just have the backend pre populate the relevant meta tags for sites like Facebook..
All this to say we're recreating something servers and CMS' already do just to write stuff in the "flavor of the week" JS framework.
Not knocking your comment. Just find it funny when folks end up using something like WP with the API just because they want to bloat shit in a JS framework where 3 templates and out-of-the-box server-side rendering would've sufficed right from WP
You're relying on server side rendering for all of your subsequent pageviews. Using React or some other front end library with its own routing will ultimately be faster for the user to load. It also allows for seamless transitions between pages.
React is also far from being a flavor of the week JS library. It's shown incredible growth over the last few years and represents a fundamental ideological shift in how developers are thinking about Javascript and its relationship with the browser. Perhaps you should spend some time reading about React and its merits.
So first, there is an assumption that I haven't read up on React. False. By that merit you sound like a dickbag. But its cool, not judging.
Second, the point I'm making is the subsequent page loads still get data from..............the server. So while yes, the page loads are fast, there is still a request to the server. Unless we're loading all subsequent page data in state? Which seems like overkill.
And if that is the basis of an argument for React. Server (and page) caching on subsequent visits is also - fast.
Using React just to use it is totally fine. Using it assuming its "what you're supposed to do" is terrible. Using a JS framework meant for state, etc for an entirely, otherwise, static website seems overkill. Over-engineering.
But as I mentioned, if the other of the post wants to try React. A portfolio is a great use case.
I think SEO and semantic URLs are not as much of a problem now especially with solutions such as https://github.com/zeit/next.js
I plan to rebuild my portfolio using React hosted on Zeit.co soon.
We used Zeit in our recent project and it turned out to be really amazing! Really easy to use and no unneeded features. Tried a lot of different alternatives before that, but Zeit won the competition.
I believed SEO was no longer an issue with server side rendering and Google's ability to execute JS today?
You may be right! Last I checked it said it was asynch so if you're data wasn't there, then it keeps going. But I am probably wrong.
Thanks all. I've been looking into SPA's for a while, due to the UX advantages these can offer. Am I right in believing that SEO is no longer an issue, with SSR and google being able to execute JS on SPA's now?
Yeah, I'm working on my own in React. http://www.conorluddy.com/development/this-site
http://itskrish.co (it's a work-in-progress)
Love this site, did you code it? I saw the ueno peeps talk at Awwwards conf.
Login to Comment
You'll need to log in before you can leave a comment.
LoginRegister Today
New accounts can leave comments immediately, and gain full permissions after one week.
Register now