The Reason I need this is just for SEO purposes.
I have a book store app built with React and IONIC. Works great and my conversion rate increased a lot when compared with my Wordpress site. My problem is how Am I going to have a good ranking on search engines ?
I have and idea having a small robot rendering all book details pages. Just the detail pages for each book I have in the store, creating a site map with those pages and uploading them using SFTP along side my CRA application. I thought it was going to be easy host some html files along side my CRA + IONIC App, I think I was wrong.
Is it possible ?
ps: I am thinking like that because sounds like the easiest way to have some SEO.
Thank you
Related
Overview
I need to improve the SEO / meta data for a React website that I made with the npm pages Create-React-App and React-Router. I would like to remake the website using NextJs in the most efficient and effective way possible. The project is hosted on Netlify.
Background
I am doing this because this is a single page application that uses react-router, and so webpage meta data is not displayed for each page when being shared on social media sites and not rendering in search engine results pages, other than the meta data included with the root index.html page.
assumptions
NextJs includes server-side rendering and static rendering. It's my understanding that this will allow distinct page metadata to be included with each when they appear in search results or in rendered page preview that is generated when the link is shared on various social media sites.
Conclusion
I will completely understand if there is no streamlined way to do this, but I am new to NextJs, and I want to make sure I am not overlooking any methods that would simplify and speed up this task. The client who ordered this site expected meta data to render with each page so they are eager to have to have the SEO improved as soon as possible.
I am trying to learn how to build an eCommerce store with 2000+ products. My first quest was to pick a stack. Most google results suggest that the MEAN / MERN stack is the best for eCommerce. So, i started learning MongoDB NodeJS ExpressJS as well as CSS HTML and JavaScript. Then, it was time to choose between Angular and React. The choice was easy, most courses and tutorials i came across were using React. Once i started learning React i was introduced to the concept of SPA. Then i started researching and found that MPAs are considered a better choice for eCommerce which got me really confused. If MPAs are better than SPAs for eCommerce, why the internet is filled with MEAN / MERN suggestions as well as eShop building courses? Thank you!
[enter link description here][1]I think SPA library or framework (React, Angular) is suitable for E-Commerce website. Because it has very fast page load once you have loaded a site. Page load = higher conversion. We see a conversion point increase of 0.4% to 1.5% on SPA than MPAs.
Also, it reduces frequent page reloading. There is big community support for SPA frameworks and libraries as well.
However, you have to figure out how to make it SEO friendly by using something like NextJs (https://nextjs.org/) or Gastby (https://www.gatsbyjs.com/) for SSR (Server side rendering).
I apologize in advance for how new I am to this all. I have a new business and there are some things I want to code for it myself as proof of concept till we have enough revenue to actually hire real coders.
Our ecosystem will have 4 major areas and I'm not sure if my approach is how to go about it or even possible.
The normal, static, info webpage that just talks about our business. (SEO and load times important)
A React JS / Next JS non-static section of that same website for blog and other dynamic content. (SEO and load times important)
A react JS employee backend for customer tracking and another tracking of customer data. (SEO and load times not as important here).
A customer portal where they can log in and see stats and stuff about their account (this will pull from data we enter in the employee backend and they can access to track progress) (I would eventually like android/ios apps as well as web portal for this so I was thinking using react-native / react-native web for this section to try and maximize code reuse. (SEO not important, but a smooth experience is)
I planed on using firebase to host it all. I'm curious if this seems it can work? Can you combine all of these different frameworks and strategies in one overall project like this without causing over bloat of download and such? Like for example, the employee backend will likely have a lot of packages and dependencies that the static front end would not require. And the static frontend would be in the same project as the dynamic blog but be built on different things (one static HTML, the other react with next.js? is that a bad idea?). Also, it's been hard to find info on exactly how goog react-native-web is so I'm just lost with this all and would love some guidance. Thank you so much in advance for any direction you can offer.
With firebase hosting you can host static sites, and redirect some paths, such as /api/* or /dynamic/* to firebase cloud functions.
On those cloud functions, you can do dynamic rendering, e.g. with remix.run or next.js.
If you use good cache-headers on those cloud functions, firebase hosting caches the results appropriately, making dynamic rendering of all pages feasible too.
Requirement
I'm am looking to host a website which contains multiple html5 games.
Similar to the Poki Games, or any other web game platform.
What I understand
I went through their (Poki Games) website and I found that multiple html5 game icons are listed on the website in a grid. And on clicking any one of the game icons, the website starts loading that particular game from an external source inside an iframe.
What I Need answer on
I want to know how they are serving multiple html5 games from another domain. Since each of the games are loaded in a iFrame I'm aware that they all have their own index.html
How to achieve the same, what approaches should I take? So that if I do
<iframe src="//another.domain.com/randomHtml5Game_1"> // will load randomHtml5Game1 game
<iframe src="//another.domain.com/randomHtml5Game_2"> // will load randomHtml5Game2 game
My skillset
I am primarily a frontend developer have experience with hosting in heroku. Also have some experience with firebase. I'll be using React along with phaser for development.
From my understanding of your question, the answer is very simple.
Just use code splitting and different render enpoints.
We would have our home page with various links to other pages (Image grid). When we click a image it changes the route.
www.domain.com/game1
www.domain.com/game2
www.domain.com/game3
You will need to code split the routes using various different ways. You could use webpack, or NextJS (Easier framework), or if your just using create-react-app, just use suspend and lazyload.
On a particular route it will load your html and javascript and run the game.
I am going to guess this isnt the answer your looking for but its a start ?
Let me know your thought ?
Daniel
Firebase supports hosting multiple sites/domains using a single Project.
You could sepparate each game into a folder and host each of them separately and with a different domain.
You can find more about it here.
I use this for example when deploying Web Apps. One domain is the app like app.appname.com then another domain www.appname.com is the landing page and if the project as an REST API I host that under api.appname.com. In my case I just use different prefixes but the whole domain and url can be different.
The benefit is that if you use other Firebase features you can shared them between all those projects. For example the authentication or databases.
I am preparing e-commerce project in AngularJS, but i have doubts.
SEO? Is it problem or not? If i know it is possible to have good SEO
with AngularJS with google,but what with others searcher engine?
I experienced many tools like tools for tracking users (how users
fill forms, what they do on sites etc.) doesn't work with dynamic
contents.
Is world ready for dynamic webpages like AngularJS or not yet? I am really not sure... do whole project in AngularJS or static pages...
Maybe some example of working e-commerce project, for example shop or something like that which SEO and users tracking are important? Good ready project is always good prove.
I just want be sure i wouldn't lose traffic from SEO and i would track and analyze users behavior on my sites. I am not really sure would i?
Ok , so what I can tell you from my experience with angular :
SEO is definitely a problem, but there is solutions out there (like https://prerender.io/ ). Is it enough for e-commerce ? I don't know.
We use google analytics in our (quite big) Angularjs project, it works (it's not as easy to install though, but some have contribute project that can help https://github.com/revolunet/angular-google-analytics )
[EDIT]
For Angularjs e-commerce exemple app you can look at the builtwith page :
https://builtwith.angularjs.org/
And use e-commerce tag.
One of the e-commerce site was :
https://www.hatch.co/