I have a web application in Laravel 7 and Vuejs2 which have some pages like home, about, cities and help. these page need to be crawled by search engines.
I have tried both ways, prerendering and server side rendering without success.
for pre-render there is only one package prerender-spa-plugin which is very old and not updated since 5 years.
server-side-rendering is also difficult because my web app is already designed and is going to production, it is hard to implement that now, and also not recommended to implement server-side-rendering because of 5 pages.
any suggestion are appreciated to make these 5 pages crawelable by search engine.
update:
my application contain other pages and components which do not need to be SE optimized, pages like user account and profiles.
Overall, I recommend the usage of Nuxt if you want something that could deliver a professional experience, on top of managing all the flexibility that you wish to have with an SSR/SSG tool.
Here is a more detailed answer regarding your currently available tools to achieve some SEO-crawlabale content: https://stackoverflow.com/a/69075962/8816585
You mentioned that you wished to keep some pages as SPA-only, this is also feasible thanks to the generate.exclude key of the configuration: https://stackoverflow.com/a/66472634/8816585
Related
im new here, lately i've tried to find a way to recreate a GUI for an application and still maintain his functionality.
Let's take SnapChat as example, i would redesing the application GUI but without editing that part of code that makes the application function.Im sorry if im not giving very specific explanations but i really don't know how to say it. Im really clueless on how to do so, and even if is possible in in the first place.
If someone could help me out it would be really apreaciate
So far i haven't tried anything bheside searching something online.
I believe you want to make a 'frontend' that looks like Snapchat and have it functioning like the real site. You will need to have a backend will all the features of Snapchat. Most websites on the internet have two parts to them - frontend and the backend. And most sites won't allow you to access their backend from other frontend for security reasons.
I personally don't use that site so I don't know about its features, but assuming it's a chat platform you will need user authentication and some way to store your messages.
You should start out with React or Vue.js, and work your way up to responsive sites like Snapchat.
A quick and easy solution would be to create an extension that changes the styling once the site loads on your machine so you don't have to code your own front-end.
Well, I trying establish a web page with a wordpress and GoDaddy hosting. I want to make fast web page, because people says fast web pages appear on first line at Google (as specially mobile web page speed is very important people says). So want to make very fast web page but my level of knowledge is not very advanced, I progress by learning.
If I test my web page with Insights, mine mobile score is about 60-70. If I read reports of Insights there are lots of improvements links appear at blow. I want to learn how to fix that. If you help me make an example, I will do the others myself.
If we start at first problem which is /css?family=…(fonts.googleapis.com) this problem seen below of "Eliminate resources that prevent rendering" topic. So how to fix it. What should I do?
Also at the "covorage" tab there are some source codes are seen and it is not using. For example I am not using easy-sheare plugin (secong row at the image) at homepage.
How to remove safely that codes from home page. If I can learn how one is made, I can correct the others myself.
The issue you are running into is something I have seen over and over again. GoDaddy and Wordpress sites generally are bloated and perform poorly.
Here are some tips to improve your speed & get a better PS ranking.
Hosting: Do you need to be on Godaddy? I have seen this time and time again. Most websites on GD are SLOW. GD is good for domain registration, not for hosting. Most non-tech folks do not know any better. Try using Amazon Lightsail, AWS-S3, Google Firebase, or Netlify. They all offer much faster page loads by reducing initial server response time. And they are surprisingly simple to learn and deploy.
CDN: You must use a content-distribution-network (CDN). Check out Cloudfront. They offer a free tier that works quite well.
Wordpress: This is your real issue. Wordpress is neither easy to build nor easy to maintain. You need multiple plugins to make the site perform. Best you build your own. If you have to be on Wordpress checkout image optimizers, minifiers, and cache plugins. Gumlet, WP Rocket, Shortpixel are quite popular to improve speed.
I've run into a problem that I'm sure many new/junior web developers are facing. Before I state the problem, it's best if I first list the events that drove me to the "issue".
Step 1 - The Front-End:
I followed tutorials which allowed me to create a Vue project using the vue-cli - I now have a nice front-end ready to go, albeit it is in a way "standalone". It sits in its own directory.
Step 2 - The Back-End:
I move on, I start to look at the back-end. Laravel plays well with Vue so I go with it. Once again I follow tutorials, I create a database and an API. Fantastic.
I now have the barebones core elements for a CRUD application. However, the way the back and front end are connected seems to be convoluted (although this may be due to my inexperience and improper understanding).
Solution 1:
Some tutorials insist that the Vue project is "re-created" within the Laravel directories so Laravel is in charge of rendering the views.
Solution 2:
Others, from what I can tell keep them physically separate and have the front-end interact with Laravels API only.
What are the best practices when it comes to stack architecture? Should we aim to bundle the stack together as proposed in solution 1? Is solution 2 even possible or is that due to my misunderstanding? If it is, how is deployment handled?
From my point of experience, both are correct and the answer depends on what you want to build 😀
First, if you have a simple website and you want to make the front-end of it in vue and it is only this one website, you can put it all together and make the frontend in Vue, which is handled by laravel in the backend and you are done.
Second, the step further, is for this case, that you can have several frontends for your project. Example: You have a website and several (native or universal) apps to display your data. In this case, you can build an API, that handles all the logic, all the business secrets, and this stuff, that no one should know in detail. After that, you are free to build any frontend (Vue, native, plain-HTML), whatever) you like, that's the only purpose is to display the data the API gives back (with some little logic in it, of the cause, but the secret business logic is hidden in the API). You can even outsource the generation of an app, so you build the website frontend in Vue and another one can build an ios-app with swift or an android app with kotlin.
Hope, you get the point, the answer is, as often: it depends 😉
I have created Web API.I know the Main advantage of Web API is cross domain application (I can call Web API in all platform). My question is ,Is there any performance issue When I call Web API in ASP.net WebForm???
I would like to know the below scenario
1.I Can use Direct SQL Query in .aspx Page
2.I Can use Web API and generate JSON to DataTable
I would like to know which one is fast and better to use.......
I have tried in JQuery,the performance is fine but I would like to call in ASP.net WEb Form
Where you call the API from or from what type of app makes no difference. Your issues are going to come from how you use it and what you do with the results of the calls.
Yes, you can get JSON data from the API and yes you can convert that to a DataTable, technically no issue there, but the performance will depend on how much data you retrieve in one go and how many transformations you go through to get it to the state you need for your webforms controls.
You're talking about using a dead tech ( webforms ) and trying to fit some things into how that works, which while possible, is not really the way to build anything these days.
SQL in aspx kinda says it all.Assuming you have an old app, that you just do updates to then just do what you can, but I would start looking into modern ways of building web apps. You don't have to keep using webforms controls anymore.
You can't talk about scalability when you still have stuff thrown in aspx pages. You need to start thinking about a proper separation of concerns, think about testing your stuff, retrieving only the data you need etc etc. Just because you add WebApi in the mix, that doesn't mean you'll get all the benefits, if everything else does not catch up to the required standard.
There is no inherent performance issue with using WebAPI, aside from the overhead of an additional network hop.
In real world terms, I think this would be negligible and outweighed by the benefits:
You get the 'cross platform' benefit you mentioned.
Better scalability as your 'service' and 'web' concerns are seperated and can be scaled appropriate to the load they need to serve.
The service layer functionality is re-useable, for example if you wanted to develop an app later.
I have very decent HTML and CSS skills and a basic understanding of JavaScript. I'm currently designing a system where different users can store an inventory list (a separate list for each user).
I started with plain Mongo, Express, Angular and Node Stack. But when researching about user authentication in MEAN-Stack I stumbled across Mean.io which seems to have a build-in user auth/management.
Is it usefull for a beginner to start with such a MEAN Framework or better to stay at the basics for a first try?
MEAN frameworks like MEAN.io or MEAN.js are great for structuring an app but you still have to understand how everything works. It may be better to go with tutorials from scratch to learn then use a framework once you want to actually build an app. Start with a node/express server using a simple html/js page to understand API creation then add angular to learn the frontend stuff. This will help you understand what MEAN.xx is doing with regards to the frontend vs backend. MEAN.js for example puts all the backend (E and N) stuff in the server/ folders and the frontend (A) stuff in client/ folders.