Launching project to cloud/production (Node.js + Vue.js) - mysql

A while ago, I started a project with Node.js on the back end and Vue.js on the front end. I never saw any difficulties in executing my project in development.
I know that with Vue.js it is possible to generate a dist folder, but I don't understand how to use it.
Now I'm trying to create a docker image with my project and I was in doubt as to how its structure should work, I should create an image for the Back-end and another for the Front-end, and even if it is possible it is recommended to to do? With the docker image I intend to launch the project on Google Cloud.
I also have doubts on the question of the database, whether it should also be in the same docker image or should I separate it from the Back-end?
This is my project structure

It depends on your expected traffic. If you expect a higher load, horizontal scaling would suggest to put them in separate images because then you can scale out the frontend and the backend separately.
frontend
Whether you use CI/CD or not, when building your frontend image you want to use a web server around the frontend, there are options, pick your best known (Apache httpd or Nginx... etc). Make sure that if you are using vue-router you configure your rewrites to send everything to the index.html, otherwise your routing will not work. To finish up within the dockerfile you copy the dist output to your html root.
database
Regarding the database, putting it in the same container would mean that if the backend or frontend fails for any reason your database goes down as well. Don’t do that.
Having it within the same image but running as a separate container might work, though probably very tedious to achieve this, I don’t really see the point to be honest. Just use a dedicated database image and deploy it separately.

Related

Heroku via Github, where is my JSON files updated?

This isn't exactly a question in need of help, however, I am curious as to which file is updated, when updated, when I use Heroku via Github. Would it be the one within my Github or does Heroku save those files and update them somewhere else?
All I'm trying to accomplish is edit a JSON file so I can store an integer to each player (I'm using a worker, for a discord bot). Also, yes, that seems like what I am trying to do. Anything that saves the information, doesn't require money and isn't too complex
EDIT:
This issue has been solved with the answer that Heroku simply cannot update JSON files. I have resolved it myself by moving my host onto a Raspberry Pi 3 Model B+. Thank you for all the answers.
When you use Heroku's GitHub Sync feature, a deployment will retrieve your code directly from GitHub.
Those files aren't saved anywhere else. A new deployment from master will take the code fresh from GitHub.
All I'm trying to accomplish is edit a JSON file so I can store an integer to each player (I'm using a worker, for a discord bot). Also, yes, that seems like what I am trying to do. Anything that saves the information, doesn't require money and isn't too complex
Heroku's filesystem is ephemeral. Any changes you save to the local filesystem will be lost when your dyno restarts, which happens frequently. If you scale your application to multiple dynos you'll also run into trouble since the ephemeral filesystems are dyno-local.
Your best bet is to use a proper client-server datastore, like PostgreSQL. Heroku provides its own Postgres service, which has a free tier. If Postgres isn't to your liking, feel free to choose something else.

AngularJs real time app with mysql server

Is it possible to build a realtime app using AngularJs with a mysql database?
I've been reading thousands of tutorials, but they are all focused on express, nodejs, etc.. didn't found any documentation on wheter it's possible or not. I tried to take a look at the socket.io docs, but still didn't found anything relevant to this question.
I didn't tried anything yet because of this. I use a webApp based on AngularJs on a apache server (local).
Where should i start to be able to build a real time app using these tools i have?
Do i really need to use a node/express server?
What are the main consideration i need to do before taking this step?
Is there any documentation i should read?
I need to do this real time because it involves product orders, call center, ticket system, etc.. So everytime there is a new ticket is opened/changed, new order arrives, etc.. I need to make the user aware of this, without the need to refresh the page.
Or if someone could give me a further explanation of this concept and how to get started, it will be great.
You can run angular on top of any backend, although most examples push towards REST. If you want your app to feel like a real time application, using WebSockets is a likely improvement.
WebSockets play nice with Angular, look at https://github.com/wilk/ng-websocket for example. A back-end in Node will work, but many other backend techs will do equally well.
Here is a decent tutorial using MySQL, NodeJS, and Angular: https://codeforgeek.com/2015/03/real-time-app-socket-io/
I recommend that you keep using a webserver like Apache (my personal preference is Nginx). You can proxy API and socket requests to Node, and serve static resources for the app from a folder.
Check out https://httpd.apache.org/docs/2.4/mod/mod_proxy_wstunnel.html if you stay with Apache. Check out http://nginx.org/en/docs/http/websocket.html is you go for nginx.
Without a webserver, you'll have to either:
serve your static resources with Node (polluting your server project with client code), or
work with different ports, risking the app becomes unusable in client environments, or
work with different domains, giving you a CORS head-ache.
Although I don't have much experience with Node, MySQL with Node.js should help you out a bit.
You'll want to move away from Apache if you want to do websocket stuff with Socket.io
Yes, it is possible to create a software with AngularJS in the front end and any other server side language that speaks to MySQL. Few months back I worked on a software with Java Spring Framework in the backend with MySQL database and AngularJS with bootstrap in the front end. You could start by following the MVC pattern, where your views can be served as AngularJS and your Controller can be in any server side code, with MySQL database.

Migrating Widget Settings in WordPress

I've done a lot of WordPress migrations from one server to another at work and elsewhere, but one strange thing I've never been able to understand is why widget settings never get carried over.
I'll dump the MySQL database, find/replace localhost with the live domain, SSH the database up to the live server, and then ftp the whole WP installation (core and theme, from my local machine), and still the widget settings are wiped out. And sometimes this is also the case with values saved in theme options pages I make in the Dashboard.
What am I missing?
Wordpress stores widget options - and some plugins and themes also store their options - as serialized data, and so you have to be more careful than a full find/replace of the URLs.
Much more comprehensive answer and some other ways to do move databases and retain serialized data: https://wordpress.stackexchange.com/questions/9076/why-is-my-database-import-losing-text-widget-data
To move a wordpress site and to reconvert all serialized data I used this script.
the using is very simple, download the script, change the credential variable to the database inside the php script and run it.
link to download the script:
http://davidcoveney.com/575/php-serialization-fix-for-wordpress-migrations/
work fine.
Don't do it manually!
Dont edit database manually when migrating between different domains!
Use small scripts, like this:
Wordpress-Migrator.php (read description too.)
because SERIALIZED arrays needs to be modified specifically too!!!

Dealing with mass images, some small - some large, in spring/java application using mysql

I was wondering what the best pattern was to handle the management of images these days when using spring/java and mysql.
I have several options. Some of the
images are just small avatars for
the users. Is it fine to put these
directly into mysql? Or use the file
system?
For the larger images, is file
system pretty much the only option,
and then use mysql to store the
location on the file system?
Where is a good spot to put them on
a linux server? /var/files/images?
Since the files are hidden from the
war deployment directory, what is
the best way to stream them? Use
some kind of a file output stream as
the response body for an http
request?
Also, do I have to develop all of
the file management stuff myself,
like cleaning up unused files and
the like?
What about image security? Some images should not be accessed by everyone. I think I'd need to use a separate url with Spring security checking the current user for this.
I'd appreciate advice on all of these questions. Thanks.
You could use MySQL, and that would have the advantage of centralization and easy cleanup, but IMHO it's a waste of the database's resources if you plan to scale.
For data like images where everything is public, consider something like Amazon S3 which allows you to serve images directly from S3's web servers. If you plan to host everything yourself, just serve from a directory. Just remember to turn directory listings off :)

Wordpress post sync / publish to production

I'm using wordpress as a simple backend CMS for a flash site. Posts are queried and displayed in list format on the frontend. I want to be able to make post edits or add new posts on my staging server, and have a quick and easy way to publish changes to production without having to do a full mysql db dump / import. I've looked around for plugins or solutions but haven't found any. Seems like wordpress needs a "publish to production" option.
The intended workflow is that users can create or edit content as much as they want, then an editor will go through it and approve content. Once everything looks good on staging, we publish to production. Any ideas?
Some of this thread at Wordpress might be relevant for you as it concerns moving from staging to production and the use of relative and absolute paths, etc.
WordPress does have a preview button that should allow you to see the WP content without actually publishing. If you must see it in the flash site, I think your best bet will be to setup your flash site with XML-PRC.