React & Laravel: split API and Frontend? - reactjs

As I have learned a lot for now about React and Laravel, I can of course create a laravel app using
laravel new MyApp
and set the preset to react with
php artisan preset react
Now I can build a nice app with frontend and API.
But is this best practice? I'm wondering if it wouldn't be better to install a react app i.e. with create-react-app and seperate it from laravel as I don't need the whole view stuff in laravel.

Building with React CLI create-react-app
You can host your website with static hosting server which is far more cheaper for more traffic scenario.
Although separate php server his required to host api part with laravel but, these api can be used in mobile apps. You may host on single server with a subdomain.
SEO will be a headache. You will need a separate nodejs function to inject the seo tags or any other way.
As you frontend and backend is isolated, your system will be a bit safer from backend/admin panel vulnerabilities. You just need to secure all your apis.
Building within laravel php artisan preset react
Easy SEO part with server side rendering possible using laravel.
Single server, single domain easy to maintain.

Related

How to deploy next.js frontend and separated express backend

I'm developing an app that contains next.js as a frontend and separated backend server running on express. I'm wondering about production deploy and costs, I did some research but I'm not sure what's the best way to do it.
My folder structure is following. I have separated packages.json on the frontend and separated on the backend. Two apps also run on different port. Also I'm doing SSR on the frontend.
Next.js already includes a server like express. API Routes allow you to build a backend deployed along with the rest of the next application.
API Routes live in the /pages/api folder.
Think longterm. If in the future, it'll need to be scaled to accommodate traffic or have must separate domains then separating the backend from the frontend is the best way to go. This way each team can focus on their part without messing up the organization of the entire project. Also you have a clean interface for your clients (frontend, CLI and SDK). If not then having the backend in NextJS should be fine.

React + Laravel, should I do it in 1 or 2 seperate repositories?

After learning Laravel basics and React.js basics I want to build an app that use Laravel for backend and React.js for frontend. Would it be better to include the React.js in Laravel app with artisan ui react or do it in 2 seperate repositories, 1 for Laravel to build APIs and include it in an addon domain e.g www.api.mywebsite.com which would act as a backend website and redirect to the React.js app if accessed by public and 1 for React.js app that would be used for public, on the main domain e.g www.mywebsite.com which would just fetch data over www.api.mywebsite.com. So which way is better as I'm developing both frontend and backend, and I also plan on learning and developing React Native mobile apps that would use the same Laravel backend?
Both alternatives work just fine, but it's easier to set up an api.mywebsite.com subdomain. Since you are going to also develop mobile apps that will connect to the API, that strengthens the argument of separating the API from the front-end app.

How to Deploy Django Rest Framework and React on AWS

I am very new to deploy Django and AWS. So now I would like to deploy my separate project (drf + react) to AWS.
So How can I deploy the separate project to AWS?
EC2 vs Elastic BeanStalk which one is better for that kind of environment?
I already search for one day but I found nothing useful information and found the similar thing but I don't understand like that=>
Deploying Separate React Frontend and Django DRF API
You asked a difficult question. I think I can make it bit easy for you.
First let's look at the differences in the options.
Serving the front end app
Option1: Django to serve react app
In this option, the Django app will serve your app in a route for e.g /app/. Basically the route /app will load react app's index.html. it's that simple.
In order for this to work, you need to build your react app using npm run build and copy the files to Django's static folder. good so far?
One of the benefits option 1 gives, option 2 doesn't is, you can use the same domain for backend and frontend for e.g www.example.com.
Option 2: deploy front end in S3
You still need to build the react app using npm run build, but you will not copy that to Django, in other words, you don't want to Django to serve your front end app, you want s3 to serve the static website. this method requires a separate subdomain or domain to host the react app.
Thats is the only difference between the options. Your frontend app will make api calls to the Django api, thats same for both options.My preferred option is option 2 to reduce complexity.
Deployment
I would pick elasticbeanstalk because it's easy to start with. You can do everything in the elasticbeanstalk console from load balancer to SSL, Healthcheck, Changing EC2 Keypair for EC2 Instance etc. Deployment is very easy. It supports multiple environments, You can use one AWS account for your test and production environments.

Deploy React JS bundle with Yii code base

I am looking for a solution to deploy me ReactJS application bundle with Yii(PHP) code base, I am already having an Yii application which is having frontend and backend both, but some of the page I have migrated into ReactJS application, I want to run both application on same environment,
I need help to configure the application and manage the routing also in the same fashion like old application will reload the page and ReactJS based code will run as client side.
Server: AWS
Technology: ReactJS + Yii (PHP)
Any suggestion !!!

How to deploy a angular app that isn't scaffolded with yeoman

I have a angular app, just a angular app so no nodejs or other backend is involved. I have a separate backend setup with an API. My angular app communicates to the backend with the API.
Now when I want to put my angular app online, how do I do this? If I just put the html files online I get all kinds of errors (I already have a separate question for this matter, which is unresolved). Deploying to heroku doesn't work because it isn't a nodejs app.
So how is this accomplished?
You can use an apache server or nginx to serve static content on a remote server. Personnaly I use Nginx, it doesn't require a lot of configuration (almost no configuration) to works.

Resources