I'm just curios about this situations creating app with React Js. Is there any way to build directly on the hosting Cpanel not on localhost during development? I don't know if this question is right I'm new about this but how about if were done developing on local then build and upload to server, if there is small changes of the application then you can't change directly on the server because the code is bundle and minified. I tried to search on google and watch tutorials but can't find it. I know there nothing wrong to build on local, however I like the point that while i'm building I know it works very well and see it on live then if there is small changes I could change directly.
Apologies to my curiosity. Thanks in advance for your ideas and correcting me.
I'm not sure if react requires bundling. It is not so big itself. One useful way that you can do it, just build your react app in local, then create a git repository, push it to there then from there you can pull it to your server by connecting your server with SSH.
This way may require some installations on server side again with SSH connection. You can search the details about the way I suggest you.
Appreciating your curiosity, I can think of two possible (not at all recommended though) solutions.
1. Dump jsx
React applications requires a build process primarily for JSX syntax. It is developer intuitive. If there is no jsx in your code no need to build. So, this jsx
return (
<h1>Greetings, {this.props.name}!</h1>
);
Should be written as this js
return React.createElement('h1', null, 'Greetings, ' + this.props.name + '!');
2. Setup development environment in Server
This is a risky one. There're possible security issues.
Its like have a centralized code base on the server that anyone with access can modify.
Here, you can edit files & run build task directly on server.
Notes:
Today's basic development flow is code -> build -> deploy. Better stick with it for serious applications.
Related
I'm developing an application in ReactJS where I quite often push new changes to the the application.
When the users load upp the application they do not always get the newest version of the application causing breaking changes and errors with the express backend I have.
From what I have researched you can invalidate the cache using "cache busting" or a similar method. Although from all the questions I have seen on stackoverflow they have no clear consensus on how to do it, and the latest update was sometime in 2017.
How would one in a modern day ReactJS application invalidate the browsers cache in an efficient and automatic way when deploying?
If it's relevant, I'm using docker and docker-compose to deploy my application
There's not one-fits-all solution. Pretty common is adding some random hash to the bundle file, which will cause browser to process the file again from server.
Something like: app.js?v=435893452 instead of app.js. Most modern bundle tools like Webpack can do all of that automatically but it's hard to give you direction without knowing your setup.
Caveat that docker is completely new to me and I may be making glaring errors in the configuration that I'm simply not aware about.
My goal is to have a droplet on digital ocean doing two things. Pulling the image from a repo when it is modified and running the container.
The container will need to run a react application. This should also pull from a repository on change.
I currently have a docker image for my react project. And the questions I'm trying to answer are:
Docker image pull on droplet:
Pull an image from a repo on a regular schedule
Restart the image
React application pull on droplet:
Pull a version from a repo on a regular schedule
Restart the application
It occurs to me that pulling the version from the repo could be achieved with a cron job. It's been a long time but I could probably figure that out.
I realise this question provides few details. I'm still trying to get my head around many concepts here and I find that a lot of the documentation doesn't quite provide the answers I need in whole, and if in part it's small parts strewn across many pages. Any help, or pointing in a direction is greatly appreciated.
You can use WatchTower
Pull an image from a repo on a regular schedule
Restart the image
Full documentation here : WatchTower - Go to the Argument section to view Scheduling arguments.
I don't know why you want to pull the project from repo while running the docker image but for this, you can use jenkins for CI/CD on the digital ocean server.
You just need some basic tutorials to do this:
Pull a version from a repo on a regular schedule
Restart the application
I think first you need to clarify some basic concepts.
Image is like a template
Container is the instance of an image
The images can't be restarted because those are not instances of something while containers can be restarted because those are running a specific version of an image.
Also, I think you're implementing bad approach updating under a cron your environment because what would happen if you by accident push a wrong image? All the system will fail, so, IMHO, I strong recommend you don't do that, better yet, do it through a tool like Jenkins, Github Actions, Gitlab Pipelines, son on, and use better practices of CI/CD.
I'm trying to start my first web project. My experience is with .NET desktop development and I'm very new to the Java/Kotlin world. Client side I want to use React and write the code in Kotlin, then transpile to JavaScript. Server side I would like to use Ktor both to serve the static content (React app + various assets) and REST endpoints for the SPA. I would like to use the Multiplatform feature to be able to share as much code as possible. My IDE is IntelliJ IDEA.
I would like to have auto-reload and be able to debug both React and server code for development and I would like to be able to create a single fat jar with the complete application (frontend+backend).
I started with the template that IntelliJ provides for multiplatform JS+JVM. I have been working on it for more than one day with little success and also haven't been able to find any sample online with all the features, and also haven't been able to combine various samples due to insufficient knowledge. Only thing I got is either running the application without autoreload or creating the jar file by adding "manifest" to the build.gradle file which breaks my run configuration.
I would very much appreciate if someone could provide or point me to an example with these features which I can use as an starting point for my application.
Here is a link to an example to get you started.
https://play.kotlinlang.org/hands-on/Full%20Stack%20Web%20App%20with%20Kotlin%20Multiplatform/01_Introduction
I am still discovering awsmobile and still have to read a lot of doc but what I don't really understand is why awsmobile init generates a awsmobilejs/backend in my React project because:
1) I think FE and BE should NOT be in the same repo.
2) I'll probably be creating mobile apps later, also in separate repos. How will it work then? According to doc I have to run awsmobile init <project_id> again which will download the awsmobilejs/backend folder there too (duplicate)
It makes sense for me to separate FE and BE, especially if you have several front ends (WEB, and mobile apps).
Aws mobile hub even lets you create several "apps" in the console (android, iOS, web and react-native).
How do I separate everything? and "connect" them later?
Bonus question:
How does awsmobile (cloud-api) differ from aws SAM
They seem to achieve similar things for the Backend
Thank you
Enabling developers to develop frontend and backend in the same project was actually one of the design goals of the awsmobile-cli. We thought it would make development easier.
And one BE project can be linked to multiple frontend project using awsmobile init <project-id>, as pointed out in 2).
I don't see any issues with this setup, but arguments against this design are welcome, and will be taken into consideration in our future updates.
It'd be more helpful if you describe some scenarios in details that this design leads to bad project development life cycle managements.
I have created a Web Content Management library for use in WebSphere Portal. At the moment I'm using import-wcm-data to import the library, then I need to add some additional propeties to 2-3 files on the server under Resource Environment Providers and then restart particular services so those changes are detected.
Can anyone explain the benefits of using a paa over writing a simple bash (or similar) script to automate this process?
I don't understand if I get any advantages when using paa, or is paa even capable of updating properties files and restarting services?
I have been working intensively with PAA files and I must say that it is a very stable way of deploying a app requirering multiple depl steps and components.
It does need a startup process but is well worth it in a multi server environment.
You can do all the tasks that you can do in a Ant file as well as using the wsadmin script interface. I only update res env settings and the such in WAS and do not touch any props files for that reason since all settings are stored in WAS.
In my experience, a PAA is not a good method if you're merely importing a content library.
I don't think I understand why you are doing the import manually and not syndicating, but even if there's a good reason not to syndicate, the PAA process was too involved and required too many precursor actions (deleting libraries, remove PAA, deploy PAA and then activate the portliest) to be a viable option for something as simple as importing a WCM library.
Since activating the portlets I was importing with the PAA was an extra step, I don't believe you can restart applications either.