Port a nextjs application into a php site - php

I have a nextjs app that I'm using to process stripe payments that I've deployed to Vercel. The app is simply a form with tons of functionality built in but requires the use of an api (which is why I'm using nextjs). What is the best way to get this into a php site? I need to access the nextjs api in order to communicate with stripe. Otherwise I would have just built the react app in the php site and rendered it on the page in question per usual. I've never done this before, so please any recommendations would be huge.
Here are the options I've come up with:
iframe. I've never been a huge fan of these, but figured this was an option. I can render my app via iframe on the php site.
use the vercel deployed nextjs app strictly for the api and build the react form into the php site. Then I would simply change the api requests to point to the vercel deployed nextjs app instead of a local api.
Are there better more efficient methods?

Try vercel-php, a PHP runtime for Vercel. Using the configuration described in the README, you can use a PHP repository as your backend and fetch data from there for your NextJS app.
Alternatively, you can use this directly in your NextJS repository and instead of having the api folder inside the pages directory, just have it as a top-level directory

Related

How to integrate and run php in existing vue app in the same local host?

I have build an app with vue (not with vue cli). I ran It on my local host. What I am trying to do is to add php in this Project. But I cannot run php and vue on the same local host together. Is there a way to solve this problem ?
I know when the app is created with command line interface you can compile them with webpack. But how to combine back-end and front-end together when the app is created with vue?
Thanks a lot in advance
Vue is a javascript framework and I suppose you are familiar with javascript. In javascript, we use AJAX to interact with PHP. we used to send POST and GET request to the server via ajax and javascript and we get the response from the server.
In a similar way, you need to learn how to create Rest API for GET and POST via vueJS and PHP.
You Need to create Rest API for VueJS and PHP. There is no other solution. follow the links below as per your need.
Here is the Github Link for the Same
You can also use Laravel framework with Vue

PHP API allow access from react app

I have PHP application in Symfony 2.8 and its all REST API in ec2
Frontend is hosted in separate EC2. I am using ELB.
Now I want that only my reactjs front should be able to call API endpoint and if other try via curl or postman then it should not work.
Also I want to have some part like /public to open to public so that anyone can access that.
I am not sure if its possible to do at Symfony level or secuirty groups or NACL or ALB level.
Any ideas?
First of all you can just implement authentication and you reactjs app will only that can access this with the right credentials.
Or you can maybe verify the user-agent. You can create a specific user-agent for your react js app and check it in your endpoint.

Php - Mobile + Web App : Laravel / Lumen or Both

I am building an application and currently focusing on the mobile part .
I wanted to use Lumen microframework for the server-side and Apis to connect to the mobile app.
However i also wanted to extend the application later on to build a website (Laravel)
They will both be using the same database .
I am wondering whether i should use Laravel directly and make it responsible for the apis too (albeit it would be slower for mobile apps)
Or i was wondering if i can use a combination of both.
Lumen - to deal with server requests e.g : api.site.com/...
Laravel - to deal with the website e.g : site.com/....
You could do either or, but I would suggest keeping the website and the API isolated.
I actually just finished up a similar project.
I have a mobile app built on Ionic, an API built on Lumen and an admin CMS built on Laravel. The CMS updates content in the API via authenticated API calls and then the app pulls from it.
If you take this route, you could make API calls from the CMS/Website using client side or server side requests. My CMS uses server side calls leveraging Guzzle.
I would suggest looking at sharing models between the two applications such that you don't have to update content via API calls. Here is a nice article on how to do so.

Simple Ionic workflow, does it work with backend without API?

This probably seems stupid question. But I'm new to ionic apps. I wanted to clear this before development.
Can we build ionic app without API? like we normally do for our website.
Example:
If you go to MySite.com, you will see the site running in php with normal rendering. Would Ionic work same way or it has to go through API Send/Receive request for data handling?
Ionic has no direct requirement on data access. It is built on AngularJS, which is in turn built on Javascript. Best practices would generally have you accessing JSON data from a server by using a mechanism that is Angular aware such as $http, $resource, Restangular, etc.
However, you can execute any javascript based browser command (or even load something like jQuery to perform the data access). However, as soon as you go outside of Angular, then you will have to deal with the additional complexity of making sure the digest cycle is run whenever you have updated values that may be reflected on your view because of data binding.
And, just to be clear, none of this has anything to do with what's happening on the server side. When you are asking about accessing "without API", do you mean accessing HTML files vs. JSON data? Ionic is built to be a SPA (single page application) that is installed on the mobile device and doesn't require internet access to run once it's installed.
Therefore, especially if external/live data isn't required (imagine some type of calculator where you enter values and results can be calculated with just the data in the app on the handset -- without the need for a live server at all), Ionic apps don't REQUIRE access to an external server at all.
You could provide traditional hyperlinks to other html files, but at that point it would no longer be running the packaged/installed files that form the basis of the installed app on the handset and would instead be a web app that is relying on an external server for all views. And, of course, even if it does require access to data from a server, the often massive increase in speed by not round tripping the server with a new HTML page (only a relatively tiny JSON payload in most situations) makes it feel much more like a true native app.
In ionic, the rendering happens on your phone. The server simply provides data. So if you need any data from a server (usually yes) then you need an API.
Ionic is focused on building native/hybrid mobile apps rather than
mobile websites.
– http://ionicframework.com/docs/overview/#browser-support
As per definition, an API only defines the way your ionic app can interact with your php script. In principle, there are no rules on how you design this interaction. So yes, you can keep it quite traditional/old-fashioned. Don't get the concept of an API mixed up with the concepts of RESTful or SOAP APIs etc.

Testing in ember-cli with third-party authentication on a PHP backend

I have an app that uses ember-simple-auth for Google authentication. All requests to my PHP backend are authorized with a Google access token, which the backend checks with Google before doing anything else. I understand ember-simple-auth has a testing package, but how would I go about testing this app?
The backend is a part of the app's repository, under app/api/.
An approach would be to customise the PHP code depending on the environment (importing config/environment.js), but it's on the backend and it's written in PHP.
You don't want your ember cli tests to depend on the backend so you can simply use ember-simple-auth-testing which will give you a readily authenticated session without interacting with the server at all.

Categories