DEV Community

Don't build your portfolio with just React

Dinesh Pandiyan on February 01, 2019

TL;DR - Use React along with Gatsby or Next to build static public sites. React is all the rage these days and IMHO developing websites feels a lo...
Collapse
 
martis347 profile image
Martynas Kan

So if you create your site with just React, only your page title will be indexed and nothing else inside your React code will be indexed.

Dinesh, this is actually not entirely true. The crawlers of Google (and others) are actually quite effective with indexing javascript.

Google even provides a tool in the Google Search console where you can see how specific pages are viewed by the google bot. However to achieve that you need to be the owner of the website. Here's a link for reference: google.com/webmasters/tools/google...

Collapse
 
flexdinesh profile image
Dinesh Pandiyan

I came across this as well but I'm quite not sure if auto indexing runs JavaScript.

I made my portfolio last year with React. I wrote a blog post about it and my portfolio received a lot of traffic. It was hosted in GitHub Pages for a year. If you search "Dinesh Pandiyan" in Google now, you will get the indexing result of my old portfolio from GitHub Pages and you can see only the page title will be in search result description. Although I didn't add any meta tags in my old site.

If you search the "Dinesh Pandiyan" in duckduckgo, you'll get my new site in the search result and you'll have the entire meta and everything else in the description.

I've also read somewhere that, during auto indexing, the crawlers only wait for x seconds and if your site's TTI is longer or if you load data during mount and render the original content only after second render, you're likely to not have the content indexed. Not very sure about this though.

Collapse
 
martis347 profile image
Martynas Kan

This is true, the crawler actually waits for your content to render, and yes, if after N time there's still nothing rendered your site will not be indexed properly.

Regarding the issue you had with Github Pages, it might be that Github could be interfering with the crawling process, since your page is under the github domain (unless you're using a custom domain). OR your content was just taking too long to load :)

Collapse
 
sethusenthil profile image
Sethu Senthil

I love react but I made my portfolio site using no web framework (HTML CSS and JavaScript) because I didn't know react at the time of making. My site is pretty good and converting to react would make it sm easier to code with but is it worth it? Nobody is really gonna notice a difference besides me?

Collapse
 
flexdinesh profile image
Dinesh Pandiyan • Edited

If you could get things done without any framework, that's definitely 100x better than with framework. Your code is lighter without the framework code. Framework should only be a tool to get things done easily. You don't have to do it just because it's "good". Although, if you think your site is going to be faster if you rebuild it with a framework, then it makes sense. But for a portfolio, I don't think anyone's gonna notice if it was built with React/Vue/Vanilla. But if you're curious to learn the framework, then go for it. I learnt a lot of things in React and Gatsby by experimenting things in my portfolio.

Collapse
 
timkor profile image
Timkor

Of course employers notice when a candidate's portfolio is made with React, Vue or any other framework. It's the first thing they look at. At least for a frontend position.

Collapse
 
toastking profile image
Matt Del Signore

The main reason to use something like Gatsby (in my opinion) is if you have something like a blog. The main use of an SSR is when you have something that would normally be dynamic (like a blog) that you don't necessarily need a backend to use.

Collapse
 
maxwell_dev profile image
Max Antonucci

Also worth mentioning that for extremely simple React apps where you can build up from the bottom, there's Parcel. Although I'd mostly recommend it for people who want experience with getting all the React moving parts together and understanding how to do just that. It's rarely something used in production, I think.

Still, great article! I've also struggled a bit with the client-side downsides with React, but have lately been coming around to it more.

Collapse
 
sachin_mittal98 profile image
Sachin

I build my portfolio website with React. Here it is thesachin.in/ . Now I am thinking to shift it on gatsby. I heard a lot about this framework so should I shift it to gatsby or remain it on react