Why should I use strapi cms with React? [closed] - strapi

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 2 years ago.
Improve this question
I want to start a project but I am unable to select a technology. I basically work in JavaScript. So, develop a project with JavaScript both in front end and back end will be good for me. But I need a suggestion regarding a headless cms called Strapi. Why should I use it with React? What is the advantage and disadvantage of using strapi with react. Because Strapi is still fixing many bugs they had with their alpha version. So, I need a suggestion for this case.

You are not required to use React in your client application while creating a project with Strapi. The whole concept of is that Strapi is front-end agnostic which means that you can use it with your preferred framework or library.
The administration panel which is provided with your project is built with React, however it is completely different than your client application.

You already said, Strapi is a Headless CMS, which is defined as:
A headless CMS is a back-end only content management system (CMS)
built from the ground up as a content repository that makes content
accessible via a RESTful API for display on any device.
source
This explains why it is NOT A MUST to use a React Library, #scoupette pointed out. It does not work with REACT itself, it just sends you a data as a response, when you query something or gaining access to somewhere.
Strapi is meant to stay as a backend. Be responsible for all hard work like authentication, content type management and flexibility. When you create a content type in Strapi, you are not limited by creating only Posts or Pages, as it would be on a Wordpress default CMS configuration.
When you start developing in Strapi, generally is enough to control the backend and whole system you have created only by sending and receiving some JSON data between the listening server on default :1337 port. I do it with Postman. Whenever you decide to build a frontend, you start "rendering" the JSON responses got from Strapi. They might be displayed on your web app using: React, Gatsby, Angular, Next.js and many more. You can find their "Blog" demos with those frontend frameworks on the website.
Now lets have a look at the second part of the question:
What is the advantage and disadvantage of using strapi with react
Let's reassemble the question: Pros and Cons of using React with a Headless CMS. To know that you have to compare it with other opportunities we have, but that might get us out of the topic. Instead you might like to refer more experienced users of the frameworks in The Best JS Frameworks for Front End.

Related

Does Livewire replaces Vue.js/React.js in Laravel? [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 2 years ago.
Improve this question
I need to have functionalities provided by Vue.js/React.js in Laravel.
Does Livewire replaces the above(Vue.js/React.js)?
Thanks
no its not exactly.
in old-fashion front end developing, backend sends Html codes to the client browser to render. it could be more feature rich using css and js and other assets.
some times its getting messy to mix server-side script with html, so tempting languages has been appeared. ex : blade
templating engine translate blade into php which produce Html
but it was 2 problems:
when a user navigate to another page. he had to load a lots of redundant data like site's header, footer, ...
from developer view, front-end developer had to develop some server-side coding, and they got coupled (server-side code with client-side code)
so a new method emerges:
Single Page Applications framework (like React and Vue), they were js codes which could get just new additional data for each page.
The web application with all html css ... remains and just another pages content get downloaded with the JS and replaced with content.
and it decoupled front-end code from back-end too.
but it could be a little harder to implement method for some developers which has not separated backend and frontend developer.
if a developer wanted to use this benefits (loading data simply with ajax)
it gets a little complicate for him and he had to learn ho to develop front-end component ....
LiveWire
Livewire is a new Technology that laravel offers that is easier for a backend developer to develop a front end with SPA Frameworks.
its simple as blade.
can be efficient data transferring with ajax calls
as long as it use module based component it can be reusable like react component
but:
its not going to decouple front-end with backend codes
it dosent provide all the features of SPA Framework like : routing,client MVC, ...
I name it of it just Blade instead of JSX

What is the best solution for develop laravel and vue project? [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 3 years ago.
Improve this question
Please suggest best way to integrate laravel with vue project.
1 - develop separately a frontend VueJS App with a backend Laravel API ?
2 - develop a Laravel App and integrate VueJS inside.
Which is best option and why?
Different ways to Vue things
There are different ways we can use Vue with Laravel. We can choose to build a standalone Vue application, Single Page Application, and have Laravel provide the API endpoints, or we can integrate the Vue components into Laravel blade templates as Multi Page Applications. Whichever method you choose is up to you and it depends on your situation.
Single Page Applications (SPA)
SPAs work inside a browser and do not need a page to reload. They create a wonderful user experience and can simulate native applications that you can install on your device. The key thing to note is that they load data and markup independently.
This means that for an SPA to change the content on the page, it would never reload, but fetch the data using JavaScript. Although SPAs are fast and require minimal access to the internet after they are loaded, they don’t do too well in search rankings and usually require some extra optimization for SEO.
In our case, the SPA will load on the first call to your application, then swap out the different pages as you continue to use the application with the aid of vue-router. All the data required for each page would be loaded when the components are mounted via calls to your backend API.
Multi Page Applications (MPA)
MPAs are the traditional way web applications have been built for years. They typically reload the browser every time data needs to be changed or a request for a new resource is made. You can certainly use AJAX to simplify some MPA operations and reduce page reloads.
MPAs have an edge when it comes to SEO as they are by default crawlable. Unlike SPAs, you do not need to do anything special to make your MPA crawlable. You just need to serve the pages as they are and it will be crawled by search engines unless they are explicitly told not to.
When using Vue in a Laravel MPA, you’ll embed your Vue components directly in your blade file. You can pass data as props to the component. This won’t disrupt the page and its assets and you can easily your normal CSS and JS in addition to Vue.

How to disable AMP caching from Google Search? [closed]

Closed. This question is not about programming or software development. It is not currently accepting answers.
This question does not appear to be about a specific programming problem, a software algorithm, or software tools primarily used by programmers. If you believe the question would be on-topic on another Stack Exchange site, you can leave a comment to explain where the question may be able to be answered.
Closed 5 months ago.
Improve this question
Some results on Google Search comes with AMP (Accelerated Mobile Pages) icon on theirs links, at least when using a mobile, as soon you click on the link instead of loading the site, google show you a cached version of it rather.
I want to disable this behaviour on my results, I see at least two good reasons for it:
When sharing the link it is a pain in the neck to have the huge google URL in place of the shorter one would be just with the original one.
Security: when you access any site and see a URL other than the site you wanted to load, you should distrust it, even if it looks like google (remember, you can get phished or even get caught in a trap hosted on gsites), Google should respect that instead of encouraging users to trust it just because the url looks like google! Even worst if combined with the first reason and you want to share the URL with a friend.
I have to remove the google AMP prefix ever and ever, there is no advanced search option or cookie that makes Google give the clean URL?
According to the AMP project FAQ you cannot:
By using the AMP format, content producers are making the content in AMP files available to be cached by third parties.
As a content producer I dislike Google adding their own URL, and branding around my content... From the consumer perspective looks like the content comes from Google. They say it is to improve speed, but you can see Google's intention behind this "free" technology.
A simple hack is to keep using AMP guidelines for the speed it provides to the page, but violate one rule (like add you own javascript that does noting).
Once pages have an error, google will not cache them.
By publishing AMP pages you let Google or any other AMP cache store and deliver your web page (which surprisingly seems to be legal):
Caching is a core part of the AMP ecosystem. Publishing a valid AMP document automatically opts it into cache delivery. (https://www.ampproject.org/docs/fundamentals/how_cached)
To stop AMP from caching, the project recommends to invalidate the format by removing the amp attribute from the <html> tag. I propose something else.
One thing I always disliked about AMP ist that it requires you to embed the JavaScript code directly from their server (https://cdn.ampproject.org/v0.js), effectively telling AMP about every single visitor to every AMP page. Embedding the code from your own server stops this privacy issue, disables caching, and still gives you the framework.
To do so you can build your own AMP framework using the source code:
https://github.com/ampproject/amphtml
But it's much simpler to just copy v0.js and all the scripts it fetches to your own server.
Odd because google says to remove the "amp" from the tag to not cache.
It said nothing about loading the js locally.
https://amp.dev/documentation/guides-and-tutorials/learn/amp-caches-and-cors/how_amp_pages_are_cached/
Is google wrong?

Beginner looking for suggestion: building my first website with GAE, picking framework and looking for AJAX learning resources [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
I have zero web programming experience but has been in IT industry for a while, mainly as a CRM technical consultant. I'm familiar with VBScript and Javascript, not in a Web context but as general scripting tools. I'm good at designing business processes, database models and using DB queries. I have some basic understanding of GAE and Python by doing the tutorials by Google. I used to write some tools with C# and VB6 a long time ago.
So I've decided to build my first website on Google AppEngine, and I'm lost in so many choices and new skills to learn.
What I'm planning to build is a simple website where users can post short messages and vote upon them. Which requires a simple but dynamic front page, login/cookie handling, Reddit like post voting/aging and some data storage.
Maybe the first question is which framework should I use? I heard Flask is good for beginner to learn web programming and webapp2 is easy to start since it's integrated to GAE by default. I've looked at Django as well, it looks very powerful, but I couldn't decide.
Since my idea is largely based on a concise but dynamic front page, I guess something AJAX is a must. But I have no clue on where to start. All those Ajax, Jquery, ProtoRPC are so confusing. Which technologies should I use and where can I find good tutorials?
I am also looking for suggestions on potential challenges and anything I should learn to achieve my goal. Thanks!
Since your project is inspired by reddit, the web development course with Steve Huffman (the technical founder of reddit) will be extremely helpful for you.
https://www.udacity.com/course/cs253 - it's free if you just watch the courseware. He even explains their aging algorithms in the end.
This course covers the back-end side of building a python applicaiton with the default webapp2 framework on appengine. He doesn't cover the front-end besides the basics (HTML forms and tables, stuff like this).
Now, Jquery is a Javascript library which is used by about all of the dynamic websites. It is a convenient way to work with the DOM on the fly. Everything you can do with jQuery, you can do with plain javascript, it's just that jQuery is infinitely easier to work with.
This library is used on the front-end, and it doesn't matter what backend you choose. It is extremely simple and powerful and you can learn the basics at the free codeschool course try.jquery.com.
Basically, if you want something to happen on the page dynamically (the arrow becomes red once the user clicked on it), you use jQuery.
AJAX is asynchronous communication with the server, it can be done by plain javascript but jQuery provides a very convenient wrapper for doing it. Usecase: the user clicked on the arrow, you painted it in red with jQuery, you incremented the votes counter (again with jQuery), and now you need to send the upvote to the server without reloading the page. For this you perform jQuery.ajax() call, and pass the user data as a param.
So to wrap it up: you need to write javascript to make a dynamic page and jQuery is the most common library that helps you with this. You need AJAX to get and post data to the server without page refreshes, this is implemented in jQuery. You can use jQuery with any back-end framework that you choose. Start with the simple jQuery tutorial, then read about $.ajax call and it will be clear for you.

Single Page Apps vs PageAx [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 8 years ago.
Improve this question
Single Page Apps are well known. But PageAx seems to be less well known. I stumbled across it by accident in learning MVC and it has worked quite well for me so far.
(Note: I am aware that this is a topic which may be regarded as "not answerable" and "should be closed" yet I feel this is an important topic which has not yet been covered. Note that this is Single Page Apps vs. PageAx (not Ajax). I am looking for benefits/disadvantage type discussion. I am making up the name "PageAx" as I have not found a better term for it.)
SPA - communication with controller via Ajax and returning Json.
PageAx - communication with controller via Ajax and returning partial views which replace divisions.
Here are the benefits of PageAx as I see it, over SPA's:
Little to no JavaScript on the client.
I find Partial Views very easy to write on the server side.
Benefits of SPA over PageAx:
I can't think of any.
Disadvantages of PageAx over SPA:
Slightly larger payload (but I doubt it would be discernible by end user.)
I can't think of any other.
Disadvantages of SPA over PageAx:
Seems like the amount of JavaScript and required libraries present a fairly large learning curve (i.e., more so than MVC.)
So to re-iterate the question, are there any advantages to SPA over PageAx? The basic reason for the question is that I am starting yet another web project and need to decide which way to take it.
This depends on complexity of your application.
Returning JSON is beneficial because hey—that means you have a full-fledged API that you can reuse in a mobile app or a desktop client. Even if you later decide to completely re-do your frontend, you will already have a ready-to-use backend to code against.
Also, if your webapp is highly dynamic and interactive, replacing partial views may not be enough. You may want to have finer control over transitions (e.g. animating them). For example, see Medium-Style Page Transitions: you can't do something like this with partial AJAX views.
On the other hand, if this flexibility doesn't buy you anything, rendering partial views on the server may work very well for you. Here's David from 37signals blogging about it. He calls this approach SJR (Server-generated JavaScript Responses):
This doesn’t mean that there’s no place for generating JSON on the server and views on the client. We do that for the minority case where UI fidelity is very high and lots of view state is maintained, like our calendar. When that route is called for, we use Sam’s excellent Eco template system (think ERB for CoffeeScript).
If your web application is all high-fidelity UI, it’s completely legit to go this route all the way. You’re paying a high price to buy yourself something fancy. No sweat. But if your application is more like Basecamp or Github or the majority of applications on the web that are proud of their document-based roots, then you really should embrace SJR with open arms.

Resources