basically i am java web developer , now i change one old web application into angular and spring boot microservices. i learn basic angular form youtube tutorials and other sources , but i have big confusion on deployment , when we run command ng build --prod ,it compress all files and create dist folder.
i copy all file from dist folder and paste inside tomcat webapps folder and application run fine ,
now i want to know it is necessary to build whole project every time ? and repeat same process again and again when we make any changes on our local development machine.
i try to find the solution a lot search on google but did not get any solution please suggest me what is the proper way for deployment from local machine to production server
You can use another external front server as node.js instead of embedding the front whitin a tomcat.
with a node.js server maybe you will be able to use the ng serve -o to change files and hot swap these changes easy
Another thing you can do is to set a devops environment, but this is more difficult.
Related
Basically what I have is my frontend (Vue) and my backend (Node.js and etc.). By following a guide, I've built the frontend for production using npm run build. I got a bunch of files in a build folder I setup within a previous step. These files were then moved to a folder in the backend. It works, but it's more a demo than anything else, and the frontend and backend will have to be modified more as I continue.
I'm just wondering if and when I edit the fronted more (let's say, when I add a new page) am I supposed to go through this process again? So I'll modify the front end folder, build that, move files, etc.
Thanks.
Yes, definitely.
If we are in a development environment, we use npm run dev or yarn run which upholds the development environment running and updates the browser whenever any modifications inside the code happen. We don't use any final build in the development environment because we make code modifications so repeatedly that it would be a sore process to make a build after every modification and check the results using that build.
But, the production is distinct from the development environment. We deploy the only code which is bug-free, entirely working, and ready for users to use. Deploying to production means all changes have been made, and the final code is ready to be deployed. So, we make a final production build and deploy it to our server.
So, don't panic to deploy to production every time you make a small change in the code. First, complete your all changes, and test the changes in the development environment, if everything is working correctly then only create a final production build, and deploy it to the server.**
I hope this helps.
I have vue project which published on Digital Ocean. The main problem is when i make some changes on FileZilla it is not affect on website. How can i solve this issue?
This is not an issue per-se. This is just the way how modern web development works. Vue.js (but also Nuxt) is using a bundler right now (Webpack, Vite are the most common), hence to go to production it needs to be bundled each time you push something to it.
If you upload something via FTP or SSH and edit some source code, a bundle step will be required in order to get any changes on the actual webapp.
Backend languages may not need that, for example you could SSH into a server and change some .php file, if you F5 the page it will be updated in real time. But this is not how frontend JS code works, it needs to be optimised.
Another thing, sending code via SSH/FTP is not really a good workflow because it is not easily trackable, no version-controlled, will not trigger any build flags in case of an error etc...
The best approach is to have a git repo + some build step included in some CI.
A common platform for it is Netlify, you connect a Github repo, you tell which command to use to build the project and each time you push some code, it may do some checks/tests/optimizations/etc... via Github Actions before being released automatically to production (updated on your webapp).
This workflow have a lot of benefits as one may tell but is also de-facto, the official/regular approach for modern Web development on the frontend.
TIA for your help.
I recently started experimenting with Google App Engine, and I have been able to set up a project successfully.
However, I made a mistake with the location of my local files and I would like to change it.
This is the output from my console when I deploy:
jnkrois#dev:~/Development/My_Project$ gcloud app deploy
Initializing App Engine resources...done.
You are about to deploy the following services:
My_Project/default/1234567890 (from [/home/jnkrois/Development/My_Project/app.yaml])
Notice that the local folder is /home/jnkrois/Development/My_Project/app.yaml
I want to change the gcloud settings in order to pull the files from my /var/www/html/My_Project/
That way I can run the project locally via my Apache server.
Thanks for your help.
That way I can run the project locally via my Apache server.
In the vast majority of cases you won't be able to run your GAE project through apache. Except, maybe, for a totally static website with a very particular config.
The proper way to run your GAE project locally is using the development server, see Using the Local Development Server
But to answer your question - there is no extra dependency of the project outside the project directory, so just move the project directory to where you want (up to you to check address any permission issues, assuming all permissions are met in the example below) and run the gcloud cmd from the new project location:
mv /home/jnkrois/Development/My_Project /var/www/html
cd /var/www/html/My_Project/
gcloud app deploy
Again, donno if this will help you run it through apache or not.
I'm working on an IBM MobileFirst Platform 7.1 project where there are many name value pairs in the worklight.properties file.
Say for example,
HOST_NAME = www.google.com
I access these variables form the MobileFirst adapter.
var hostName = WL.Server.configuration["HOST_NAME"]
There will be cases where I'll have to change the HOST_NAME in the worklight.properties to a different value. But sometimes, even after the value is changed in the worklight.properties file, they are not getting updated in the adapter.
Every time when I change the values I do the following,
Clean the project
Restart the server
Deploy the adapter again
Nothing seemed to change the value.
I suspect, the MobileFirst server caches the values and reuses the old values without updating the new ones. I say this because, I tried deleting the values in the worklight.properties file, and even tried deleting the file itself. Still the adapter was using the old value.
I tried deleting the MobileFirstServerConfig Folder in my workspace. Even that didn't work.
It would be great if someone could help me clear the cache or find a work around to this issue. Thanks in advance.
I kind of followed the above method but initially it didn't work.
But later I tried to follow these steps in this exact order and it seemed to work.
Stop Worklight Server.
Remove your project from Mobile First Development Server.
Go to the "bin" directory and remove your project war.
Clean and Build the entire workspace.
Start the server
Deploy the adapters
Run your app.
The worklight.properties file is embedded into the project runtime WAR file. So, if you change anything in worklight.properties, you must rebuild the WAR file and redeploy it. Based on your description, it sounds like you're only building the adapter (and not the app). At minimum, I would suggest to remove the runtime WAR file from the project "bin" directory (just to ensure that it gets rebuilt) and build all app environments. That should build / redeploy the WAR file and restart the server, and then what you're doing should work.
Here are the steps to follow:
1. If worklight server is up and running, stop it or restart your system.
2. Clear bin folder.
3. Do Clean Project and Build for enviournment.
4. Open Mobile first Console(Start server)
5. Deploy All adapters
6. Run your app.
If wlq or wl error is comming we can give an alert message 'test' in our main file where we have all the javascript files.
I cloned universal-starter (webpack version) and have it up and running on my local machine using npm start and npm run watch per the instructions
Now stuck after npm run build and attempting to deploy to Azure (and Google Cloud) via the github integration - can't figure out how to set up either to work.
Anyone have a recipe on how to get the webpack bundled files to fire up on an external host with express.js? Do I need to run commands via a CI integration? The files in /dist don't seem to stand on their own.
At Netlify you can connect your git repo and tell them what build commands you want them to use. If you specify the "dist" directory, then they will deploy anything that gets in there (after they have compiled your application).
Edit: the lowest tier is free.
Edit2: I am not associated with Netlify. I just used them in my latest deploy, and found the process extremely easy.
Note: This has changed dramatically since Angular 2. While I'm now moved on to SSR, docker, and all kinds of other things, the simplest answer was to
1) Production build
ng build --prod
2) Transfer files to a static web host (i.e., I used awscli to connect to a s3 bucket when it was just a static site...I know use SSR so I need to use a node server like express)
3) Serve files (there are some complexities for redirect requirements for index.html for error and for 404...and of course setting the status for both redirects to 200)
4) Put something on the frontend for performance/ ssl/ etc. nginx or a CDN would make sense.