Web Dev stacks - GONE WILD --- Best Practice Architecture & Deployment? - laravel

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 😉

Related

Easiest language/framework to use for web app that follows MVC for someone who has experience with Java/JavaFX

I am trying to create a web app that allows the user to browse a noSQL (Preferably MongoDB) database and perform some queries using a graphical interface. All the queries are written in the code and the user only needs to click links and/or enter strings (mostly to search for matches to be displayed in properly formatted tables). The app follows MVC model.
Up until now I used to write similar desktop apps using Java and JavaFX. I have no experience with other languages or frameworks (Aside from C and SDL), neither have I ever deployed anything on a server, and the assignment should be completed within 6 weeks (Three other students are working with me). And I have the three following questions:
Which language/framework is easiest to learn (considering I/we know Java/JavaFX)?
The answer to that would most probably be JavaScript*, which takes me to the next question:Is there any (practical) way that I would make it possible to write the app without having to learn HTML and CSS?
The third and last question, in case I write the View class in JS or Angular, can I write the Controller and Modal with Java (If we disregard complicated workarounds)? And do I deploy all three MVC classes/packages on the same server?
*I believe some would suggest we use GWT or Vaadin, and in this case I wonder if these frameworks have any quirks or limitations that would make it difficult for us as students to work with, be it when it comes to deployment (which is totally new for us) or the writing of the code itself.
Thanks a lot in advance.
Since nobody answered I am posting the best answer I could find so if anyone googles this subject could read it. At last we went with Java for backend running on Tomcat server and JS for front end. It turns out that HTML is very simple and JS is pretty similar to C/Java in syntax.

OctoberCMS (Laravel) + Vue.js + Tailwind CSS Best Setup

I am new with OctoberCMS. There are few tutorials in the internet. May I ask what is the best setup may I use or possible setup may I use with this web tech stacks?
We have a project and the requirement is we need to use octobercms so that's why we have to used this octobercms.
Possible Setup:
Micro Service Setup?
Two seperate folder for OctoberCMS and Vue.js. The communication would be an API Request calls.
Then for the deployment part for the production, we will use the dist folder from Vue.js Folder. I'm not 100% sure but I think this will be my initial thought that will be possible.
May I ask for any suggestions or clarifications on what will I use project setup. Thank you.
While it would be entirely possible to have two separate web properties with October providing the API, you can also just use Vue within an October CMS theme itself. See https://github.com/scottbedard/vuetober for more information on doing that.
If your project is more of a traditional CMS requirement then I would recommend at least trying the Vuetober approach. If it's a lot more complex and is mostly utilizing October for its powerful backend features, then the API-only approach could work fine too.
The main reason you'd want to go with running vuetober is if you were going to be utilizing the AJAX framework provided by October. You can still technically use it even when October is being run as a headless CMS just providing an API, but it gets more complicated with CORS and some other stuff you have to setup to make sure it works properly.

Plain MEAN Stack or a MEAN Framework like mean.io?

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.

SPA using DurandalJS and laravel

im trying to create a Single Page Website with DurandalJS in the frontend and Laravel as the Backend. Do you think this is a good Idea?
If yes how would I do the following:
What would your recommendation for the basic interaction between both frameworks be?
Would you rather have all the computation done in JS instead of Laravel sending calculated and styled returns?
How Do I setup Laravels controller in order to only get dynamic Data for, say a Div, instead of a whole page?
How can I adjust the browser URLs?
I hope I was specific enough, thank You in advance.
Laravel does not actually care about what framework you use to build the Frontend. Laravel is just a framework that helps you build your application with. It gives you great advantage with respect to the time spent and effort.
You can use any frontend framework that you want to build your app with. I have actually not used Durandal, but from the first look of it here is my opinion.
Durandal is built on top of jQuery, knockoutJS and requireJS. It also has a MV* architecture in place with support for eventing as well. So you could basically define routes on Laravel and initiate the communication between both the frameworks through events and ajax. Again this completely depends on the functionality that you are building.
In the overall flow of your app, consider Laravel as a Model that just gives data from a source to your app and Durandal as your views and controllers. This way, it will keep your data flow cleaner and easier to build. Computation of your functionality depends on how important and secretive the app is. If there are functionalities/implementations that you need to be secretive about, you can keep it on Laravel and just send computed data to Durandal. If its a web app that you are building, then keeping all implementation on the JS is just a right click away from knowing what and how you have built it. One can just see how the implementation is done just looking at the Javascript source of the web app. If you are building Mobile Device App, then the case is different.
Take a look at Restful Controllers. Will give you an idea on how to setup controllers to return only data. But if you need to return the div itself, then you can make use of the Basic Controllers of Laravel to perform them.
You can setup cleaner routes for the browser URL's. Take a look at Laravel Routing

Can I use Angular JS without a terminal?

Doing anything in the terminal, git, etc multiplies my learning curve in attempting to quickly develop an app using CodeIgniter. I realize the need for a Javascript framework and would like to use AngularJS - is there any way around the terminal?
All you need to do is to download the AngularJS source files (.js files) and get coding. I am new to it too and am fairly impressed with it. However it seems to me that is is designed for different things than CodeIgniter.
Angular JS basically moves your MVC from the back end to the front end, my limited experience tells me that it is for simpler apps than what CodeIgniter would be for. You can certainly still have some logic in your MVC back end, but the idea is that Angular becomes the application and you use a back end primarily for data storage.
There may be a way to mix the two together by making limited scope Angular pages that are worked within a superstructure of the CodeIgniter MVC, but I have not figured this out yet.
AngularJS can certainly work with Code Igniter, and you don't need to use the terminal for either.
You're probably going to want to write a RESTful API with Code Igniter that AngularJS can communicate with. Check out this article for RESTful services with CI: http://net.tutsplus.com/tutorials/php/working-with-restful-services-in-codeigniter-2/
(a little old, but the basic concept is the same)
Then, with AngularJS, you'd use $http to make requests back to the API you wrote with CI: http://docs.angularjs.org/api/ng.$http

Resources