I want to use React JS for my blog website. Is this possible?
SEO is important for me.
U can use nextjs. It a framework for SEO web reactjs.
It includes server side render (SSR), ...
As #Thanh Ngo said, you can use Nextjs
But you can also create a server inside your project. Create a directory inside your project "server" and create a new directory "views". You can use Expressjs or another one. Take a template engine like Pugjs.
Now you're ready to do SEO with React. In your browser, go to the "network conditions" tab and remove checkbox "select automatically" and select "googlebot". You're now ready :)
If you don't understand something in my explanations tell me :)
I highly recommend you can use react-helmet. that can create many meta tag dynamic SEO. It's very useful with google seo
Related
as the title suggests I was wondering if it's possible to integrate a component built in React with an existing Wordpress website. The component is only about 80 lines long, consisting of a with an image. The component itself was built as part of a create-react-app project. Any insights greatly appreciated!
What is the react component your using if its available in html5 like bootstrap components for example its unnecessary to use react app and craco together due to multiple issues in polyfills and webpack so its harder to maintain if your looking for something simpler it still works and has around 85kgithub users in 2022 .
https://github.com/dilanx/craco
examples of recent issues in stackoverflow
[craco-does-not-work-properly-with-react-scripts5-0-0][1]
[1]: https://stackoverflow.com/questions/71234041/craco-does-not-work-properly-with-react-scripts5-0-0
Yes, React can be used with WordPress, where the content on the front-end built with React is managed by WordPress CMS using the WP Rest API.
Just use the WP Rest API. Hope it helps.
Does anyone have any pointers on how to go about adding a /docs page for website documentation to a next.js app? I've looked up Docusaurus but it seems like it's already a react app itself. Is there a way to integrate it inside an existing next.js app or are there other solutions?
Many Thanks
One idea might be to intercept the request and send the html file that docusaurus builds out, and putting all other files in the public folder.
https://medium.com/wesionary-team/render-html-file-in-pages-of-next-js-59281c46c05
Also checkout this discussion about it.
https://github.com/vercel/next.js/discussions/12373
I have done this with React apps using express. But never with Next. At first it looks like it would be possible with multi-zone in Next but that doesn't seem to do the job. So my other recommendation would be to try to use a docs.domain.com instead and host it separately. Then you have a /docs url or a button that redirects to the doc domain instead.
Firebase has free hosting and allows you to setup multiple sites. So it should be fast to test this setup there
I'm going to actively try to get this to work with Next myself but I do not think it will work because of how they are developed. So I would do the above recommendation and if I find a workaround, I'll post an update.
I have this website were we can create new questions. Whenever a new question is created a new url is generated I want google to crawl my website everytime a new question is added and display it in google.
I have my front end in react js and backend in express js.
My front end is hosted in firebase and backend in heroku.
Since I am using javascript and my urls are all dynamicly generated google does not crawl or index them.
Currently I am writing all dymaicly created urls into a file in my root folder in backend called sitemap.txt.
What should i do to achive this?
my sitmap link
https://ask-over.herokuapp.com/sitemap.txt
my react apps link
https://wixten.com
my express.js link
https://ask-over.herokuapp.com
i want to add
https://ask-over.herokuapp.com/sitemap.txt to google search console
In fact create-react-app is the wrong tool when SEO matters. Because:
there is only one HTML file
there is no content inside the single HTML file
heavy first load
etc, [search about reasons of using nextjs a good article
SPAs are the best for PWAs, admin panels, and stuffs like this.
But take a look at https://nextjs.org/docs/migrating/from-create-react-app. And my suggestion is to make some plans to fully migrate to Next.js.
Also, search about react SEO best practies and use the helpers and utilities like React Helmet.
create-react-app is not the way to go if you are going for a seo friendly website.
if it's behind a login screen you can go with create-react-app.
if the site is a blog or documentation site , I would suggest you migrate to nextjs or gatsby js or if it's a very small webpage go with raw html, css , js
It's not possible for Google or any other web crawler to crawl your SPA Websites. The best way to fix this is either to use Server Side Frameworks like Next.js or use pre-rendering and redirect crawlers to pre rendering server instead of main website.
You can checkout prerender.io, it has the open source version as well, you can run it on a seperate server and use one of the snippets/plugins for your web server (apache/nginx/others) to redirect requests to different upstream server.
I've been using it for one of my projects (e-commerce store) built on VueJs and it works like a charm.
To understand the basics, what it does is it'll load your website in a browser, and cache the rendered code in it's database/cache, and when any crawler visits your website they'll be redirected to cache which is the generated html page of your website, and crawlers will be able to read everything smoothly.
I have an existing Nextjs and React Application with MongoDB Backend...Client wants to edit website, no code. How do i integrate a CMS?It's a corporate site...client wants to be able to manipulate everything,,,Navbar, content etc
You can use Sanity and I've worked with it.
How to configure sanity with next js
If you know a site is using react in some way, how can you, just using the javascript console, identify if the app is running a next.js app or create react app.
I am not sure about this. But to my knowledge, one of the important feature of next.js is that it supports SSR.
If we fetch the url of the page using postman, sites developed using react app will return a html with javascript files, where as those ones with next.js or with SSR mode returns a complete page. I think it might be worthy to fetch the url and check if the response contains "Need to enable javascript" or something like that. This might not completely show that the site is built create-react-app or next.js but can help you to discriminate them.