Laravel and AngularJS in Homestead - angularjs

I want to get started with Homestead for my project. This is an existing project, and it works when using a standard WAMP stack.
I use backend and frontend as separate applications, but on the same domain, like this:
Laravel as rest backend at url homestead.app/api/public.
AngularJS as frontend at url homestead.app/client.
I have mapped my homestead.app site to /home/vagrant/project1, where the two folders api and client are located.
When trying to access homestead.app/api/public I got the Laravel welcome page. So far so good. But when trying homestead.app/api/public/user/info, the nginx log says /home/vagrant/project1/index.php is missing. But this is wrong, since the file is located at /home/vagrant/project1/api/public/index.php.
Any advice on how to be able to use homestead for my approach?

Seems like a good scenario to use a separate subdomain for the API (api.homestead.app), or just a different domain altogether.
Check out the section "Adding additional sites" in the documentation:
Once your Homestead environment is provisioned and running, you may want to add additional Nginx sites for your Laravel applications. You can run as many Laravel installations as you wish on a single Homestead environment. There are two ways to do this: First, you may simply add the sites to your Homestead.yaml file and then run homestead provision or vagrant provision.

Related

How to map multiple subdomains to single instance of MERN Multi tenant app?

I am building a multi tenant app using MERN stack. While learning about best practices to identify tenant, i fixed on subdomain approach. For example, on browsing URL like
tenant1.mydomain.com,
tenant2.mydomain.com
etc., the tenant1/tenant2 part of the URL is extracted as tenant identity to further authenticate users and start the app. As mentioned on https://github.com/facebook/create-react-app/issues/2292#issuecomment-302894212, i set up .env so CRA (npm run start) development server can serve on mapped domain instead of default localhost:3000 on development machine.
I suppose the approach works only for single tenant due to single subdomain mapping in .env, but don't know if and how multiple tenants can be taken care of. This whole stuff is new to me and i appreciate all possible help i can get to achieve multi tenancy goal.
There are a few ways to do this, I particularly create a redirection of the subdomains to my main application domain. And this works for both development and production.
Initially I left it in fixed development like you did, but now I do it
as if it were in production, it makes the development more dynamic and
real.
On any system you have the HOST file.
Their path is usually in:
Windows 10: “C:\Windows\System32\drivers\etc\hosts”
Linux: “/etc/hosts”
Mac OS X: “/private/etc/hosts”
In the HOST file I point the subdomains to my local ip or application ip. Something like:
127.0.0.1 client1.myapp.com
127.0.0.1 client2.myapp.com
127.0.0.1 client3.myapp.com
In this case it's local but it works for production, so when I run my app I don't need to use 127.0.0.1 or localhost, I can use one of those domains, and even if they point to the same IP, that way I can get the domain from the client inside application, such as:
const domainName = window.location.hostname;
And now just use the domain to make the multitenancy logic work.

How to deploy a simple json-server?

I completed an online React course and deployed my application to Heroku. During development, I used the 'json-server' module found at https://github.com/typicode/json-server. This served up a folder on my computer which contained a simple json file and a few images for my website while conforming with the REST API. What do I need to do to get the server to operate independently of my machine so that my application can fetch the data ? I have zero experience doing this.
if you mean you want to create a server for your site,
first of all, you need to get a server, which can run nodejs , then you need to deploy and run your JSON server via a nodejs(express) app.
then you can connect to your server via your website/app
in order to do these things, you can follow tutorials
there are lots of tutorials about it.
hope you got the idea.

How to access a database from a hybrid app without crossing domains?

I am developing an app with PhoneGap (Cordova) + Framework7 and I need to connect to a database. The issue is that it's an hybrid app, which means the www files are local and the app creates an internal server, and so if you try to use AJAX to run a php file it crosses domains, since it'll try to reach for my webserver while it's running it's own server. What can I do?
(I know Cordova has a utility named WebSQL that connects to SQLite, but my database is MySQL, and I think it can only connect to a local db)
(You can't move php to be local because Cordova can't run php files, also it's probably not very secure)
My suggestion is to use Ajax to access your server. (to run the PHP file) You can allow your server URL in environment variables of frontend.
Check for Content-Security-Policy and connect-src in frontend and add your server URL there. Then you will be able to send Ajax to your server.
Hope this helps.

How to deploy angular app that completely relies on external API to retrieve and store data?

For an angular app that completely relies on external API to retrieve and store data, is NodeJS necessary for deployment? What are the other possible methods of deployment? Currently, I use it for local development and plan on using it in combination with Nginx for production. However, NodeJS is not doing anything except launching index.html. So should I remove NodeJS altogether and simply use Nginx alone?
One solution is to host it using any web host, they all equally host HTML only sites, and this solution is pretty inexpensive. Hosts like Hostgator, web.com etc., will allow you to upload the site via FTP.
A second choice is to host it using a web server (Nginx), but this is probably the most costly. You can host your own server in any cloud service (Amazon would be EC2 for instance) and then host your files there. This is probably not a good option for you. The only reason to use this type of solution is if you need the server to host code, so if you were using node to talk to a database for instance.
A 'pro' option may be to put them in S3 on AWS, and host it that way, it is pretty inexpensive.
Here is a link explaining how to host on Amazon - http://docs.aws.amazon.com/AmazonS3/latest/dev/WebsiteHosting.html
http://docs.aws.amazon.com/AmazonS3/latest/dev/website-hosting-custom-domain-walkthrough.html

Hosting Angular fullstack project

I started a new Yeoman angular-fullstack project (client-angular.js, server-node.js)
(generator: https://github.com/DaftMonk/generator-angular-fullstack)
I have 2 seperated directories for client and server,
I want to launch the app but the deployment don't show any index.html file,
The question is, Should I make 2 different hosts for the server and the client?
if no, how can I host and use the united projects?
No, it is not needed to create 2 different hosts for the server.
The server needs to point to app.js, usually located at server/app.js, as this is the entry point (instead of index.html) of your app. How this is done depends solely on the server you intend on using.
If you consider using IIS you can take a look at: Installing and Running node.js applications within IIS on Windows
As for the other deployment options, as laggingreflex said, "Heroku is the popular choice to host node.js projects". The angular-fullstack git site has more information on deploying to Heroku or Openshift.
As a side note:
Deploying to IIS requires a bit more attention than the information in the link specified. You need to set file access, create a web.config file as well as a few other stuff. At least, I had to...
You'll need a host that supports MongoDB assuming you kept the Database the same after generating your application. Heroku is a great option as it allows you to setup up plugins like mongolab or mongohq fairly easily. I would also recommend looking into Digital Ocean as they allow you to set up a droplet/server that has what you need for the application to run.
If you go with Digital Ocean and are a student check out https://education.github.com/pack. You'll actually receive $100 credit towards a new Digital Ocean account which will let you test things out.
Good luck!

Resources