I have recently started with programming, and I've just purchased a reactJs template, and the content comes ordered within folders named src, public and build; can you explain to me the reason of those folders? How does a web app work with those folders?
I ask this because I believe those names for folders are a de facto standard in web app coding.
Here's a simplistic rundown:
public means the web accessible root of the site. Basically whatever is in that folder can be opened from browser address bar. Server won't provide user access to files outside public
build is where compiled version of assets are placed when you run npm build. This is what will get delivered to user
src (short for "source") contains your working files that will be used later to create the build
Related
I have two webapps - "manager" and "viewer" - coded in separate VSCode projects. These are deployed to a common Firebase project where they share a common database. The "manager" webapp is used to maintain the database and the "viewer" provides public read-only access.
To create the "page" structure I have added a robocopy to React's build script for each VSCode project to produce a structured "mybuild" folder with the page subfolder within it. Firebase.json's "public": setting is then used to deploy from "mybuild".
Individually the two pages work fine, but each deployment overrides the functionality of the other. So, following the deployment of "manager", webapp/viewer returns a 404 (not found) error and vice versa.
To cut a long story short, the only way I've found around this is to manually copy the results of a deployment for one project into the "mybuild" folder of the other and then deploy from this. But this is no way to proceed.
I think I've taken a wrong turn somewhere here. Can anyone suggest the correct "firebase solution" for this requirement? In the longer term I'd like the viewer webapp to be available at the root of some user-friendly "appurl" while the manager is accessed via "appurl/manager", but other arrangements would be acceptable. The main issue right now is finding a simple way of maintaining the arrangement.
I needed to fix this fast, so here's my own answer to my question.
It seems that when you deploy a project, firebase replaces the current public folder for your URL with the content of whatever folder is specified in your firebase.json. So I decided that I had to accept that whenever either of my projects was deployed it must deploy from a "composite" folder that contains the build files for the other project as well as its own build.
That being the case, it seemed I was on the right lines with my "manual copy" approach and that what I now needed to do was simply to automate the arrangement.
Each of my projects now contains a script file with the following pattern:
npm run build
ROBOCOPY build ./composite/x /E
ROBOCOPY ../y/build ./composite/y /E
firebase deploy --only hosting
In each script, x is the owner project and y is the other. Additionally, firebase.json in each project is edited to deploy from composite.
When I run the script for a project it first builds a composite folder combining the latest build state for both that project and its partner, and then deploys the pair.
The final twist is to tell the react build process that the result is to be deployed from a relative folder and so that the build therefore also needs to use relative references. I do this by adding a
"homepage": "https://mywebapp/x",
to the package.json for each project. Here, x is the name of the project.
I'm not able to convince myself that there's not something wrong with my whole approach to this issue, but at least I have a fix for the immediate problem.
This is my first time I am working with IPFS together with React.
Judging from the reactjs examples, the code to run the website itself does not different from non-IPFS-based website.
As per documentation of the hosting I use (www.unstoppabledomains.com), in order to be compliant to IPFS, I need to have all files in same directory level.
The command npm run build produces default react directory structure with static folder and its child folders for css, js and media.
Therefore, how to achieve that all files, produced by build target, is in same level (a.k.a there is no folder static and no subfolders)?
There's no requirement for any specific directory setup to use IPFS, you can structure your project however you see fit.
Are you seeing an error message or other problem?
I've managed to make a file uploader to the local server, with Meteor.
-.meteor
-local
-build
-db
-static
Ive write the files to the static folder, and everything goes fine, but whenever I restart the server, end build a new app, the local folder gets deleted along with my static folder.
Is there a safe place for files, which does not bundle with the app?
I've tried to write outside the local folder, just next to it, but when I deploy that version, the app wont start at all on the meteor server.
So where am I suppose to create a "safe folder" neither being bundled on deploy, nor deleted on restart, and still accessible apps deployed to the meteor server?
thanks in advance!
That depends on where and how you deploy the application. If you're using a vps or similar solution that gives you access to the file system, you can:
Write outside of the project directory, in a completely unrelated place.
Write in a hidden directory inside the project dir. So, next to .meteor, but only inside another folder that begins with a . (like .uploads).
Whether or not this will work may depend on your platform.
Is it possible to optionally override a static files directory in the Google App Engine app.yaml file if another directory exists? I have a source directory (unminified) and a build directory (minified and concatenated). I want Google App Engine to automatically use the build directory instead of the src directory, if it exists. That way I can dev using the src directory, then create a build and deploy it. Then, if I delete the build directory, GAE goes back to serving my static files from the src directory.
The reason I need to do this is because I am building an application with Backbone.js & Require.js as modules. I need to be able to optimize my code and deploy without changing my app.yaml file every time.
I'm pretty happy with my current system where my framework uses different paths in the templates to the source javascript files. Then at startup, through a combination of checking os.environ and get_application_id() I automatically detect whether I'm running locally on dev_appserver, or under my test appid or production appid on GAE.
And on to the next step, you most likely want to cache your minified JS aggressively, in which case you'd be unable to force clients to update a new version. The typical workaround is to append a hash or date string to the minified js filename whenever it's updated. This is something you'll also need to do in your framework/templating layer instead of app.yaml.
I would do this at the template layer - when you go to render the template that includes links to your assets, check to see if the minified version exists. If it does, link to that - otherwise, link to the unminified version.
This also helps if you accidentally deploy without creating a build - you'll just be serving unoptimized assets.
I am writing my first Google App Engine project, in Java, without GWT. I started off by using the gae-archetype-objectify-jsp archetype to get the skeleton structure of the project, and am using the eclipse plugin to develop and test locally.
Everything is going great (loving objectify in particular) except for one thing: my static files like images and style sheets go missing every time I run the project. I've been putting these under src/main/webapp/, but anything I create there automatically gets deleted on build.
Is there something else I am supposed to do with static files?
Cheers,
Dave
It goes in a subfolder under war/
For dealing with static files, you should really see this... https://developers.google.com/appengine/docs/java/gettingstarted/staticfiles
It's a little disconcerting that src files are being deleted on build. I don't think that should be happening. What do you have your "Default output folder" set to? (It's found in the Java Build Path --> Source (under eclipse) Shouldn't it be something like project_name/war/WEB-INF/classes. Of course it may be your maven system that is doing it and not Eclipse.