node.js express html5 boiler build script? - node.js

I'm looking for something like the HTML5 boilerplate build script, but for node.js/express server.
Any such thing?
Thanks.

Why not just use ant build manually?
You can hook that into your IDE or you can hook it into forever or supervisor so that it builds before it restarts. And by hook I mean fork the source code and do it yourself.
What exactly do you expect express/node to automate for you?

Related

What is the proper way to structure build scripts within a CRA React app?

I've built both Node.js servers, and React apps before, but I'm working on a project that requires some deployment scripting for the first time.
Specifically, I'd like to be able to have a script download a file locally and generate some json before my CRA React + Typescript build happens, in order to automate some functionality.
More generally though, I'm wondering what the best practice is for creating an arbitrary script (ideally in Typescript!) that can be run as a part of the build pipeline for a React app.
I assume this would be a node or node-ts script of some sort, but I can't figure out how to slot it into the project structure!
Bonus points if WebStorm will still be able to resolve any import/requires :)
Thanks!

How to run my node script as one of the ember's build tasks?

I am working in an ember application. From what I understood, it builds the application using Broccoli. I have a requirement where I need to process some files in the application by running a node script before the building process starts. Now I am running the node script separately and then I start the ember server. What is the right way to achieve it? Can I make it as one of the tasks during ember build process? Where should I maintain the node file in the directory?
I would recommend an in-repo addon that implements preBuild or postBuild Ember CLI Addon hooks. Addon hooks are badly documented but there are some usage examples by other addons. E.g. ember-cli-deploy-build-plus uses postBuild hook to remove some files from build output.
An more advanced option would be implementing a broccoli plugin and using that one in a treeFor* hook. This makes especially sense if your custom script needs to add / remove files from the build. ember-cli-addon-docs is a great example for that usage.
Well one solution would be to leverage an in-repo addon since the addon hooks provide alot of extra points for customization than I'm aware than ember-cli-build.js does (as far as I'm aware).
If you want to go beyond the built in customizations or want/need more
advanced control in general, the following are some of the hooks
(keys) available for your addon Object in the index.js file. All hooks
expect a function as the value.
includedCommands: function() {},
blueprintsPath: // return path as String
preBuild:
postBuild:
treeFor:
contentFor:
included:
postprocessTree:
serverMiddleware:
lintTree:
In your case, preBuild sounds like the ticket:
This hook is called before a build takes place.
You can require() whatever files you need to from index.js
A simpler solution may be to call a function from your build script in ember-cli-build.js somewhere before return app.toTree();
let my_build_script = require('./lib/my-build-script.js');
await my_build_script();
return app.toTree();
Some disadvantages to this approach include:
That it will not be run as one of many parallel processes if that is possible on your machine.
It will not be run asynchronously with the rest of the build, instead you will have to wait until it is done to start building.
You will likely have to modify your build script to return a function you can call and have it return a promise when it is complete.

Best practices to develop VueJS app with Webpack, SASS, NPM ...?

I am writing application by using Python/Flask as the API back-end, and want to separate the front-end (browser-based) as an individual project (VueJS). I've read about Webpack, but I can't find any best practice to start, such as: can we use NPM to manage dependencies, use webpack for front-end not using an Node app as an entry ...
Thanks alot
WebPack isn't a framework.
It's something that a task runner.
Exemple: You use SASS, you want something that compile all your sass file in CSS file. You create a task and webpack have a task now. And you can ask him to automaticaly compile the file when change.
Maybe what you want it's more have two project:
One who handle the data an may available with an api
One who is the web ui for the user who get the data and format it in a beautifull UI
Webpack won't be your solution. Continue with your VueJS and look at VueX for your data handling browser side.

How to deploy React app to Prod and how to manage version control

Quick background: I'm a java web developer. I deploy my apps in EARs. I'm not familiar with how the build process works for the new JS frameworks like ReactJS. I have been using WebPack as a build tool but only in dev. I'm trying to keep up with the growing tech because my company is slowly adapting to it.
Question 1
How does the build process work when deploying a React app to a prod app server (or any server at that)?
I'm guessing Node will have to be installed on the app server with WebPack as a globally installed package so when the app is ready to be built, WebPack will kick off its build script in the package.json file that will create your bundle.
Question 2
If the above ^^ is somewhat correct, how do you kick off the WebPack build script?
My company uses IBM's Rational Team Concert as version control. RTC uses Ant scripts as their build so I'm guessing since we have a Spring Boot API that uses Gradle, we can tell the Ant script in RTC to run the Gradle script so the Spring API will build. Right before the Gradle build ends, Gradle can kick off the WebPack build script that will create the bundle.js. And from there you should have a full functioning frontend service just like you would when developing it.
This whole process has a been a headache to wrap my mind around and would like to get some clarification because there's only so much I can research without pulling all of my hair out. I hope I'm somewhat close to the correct way this process works.
In new version webpack (>=4) added new options mode for set environment. For get more information read this tutorial
webpack conf for production
and about deploy (ci,cd), webpack required before build, after build you don't need any js tools (SSR other case). Just create archive (project_${branch_name}.zip) and upload some store like gitlab, awsS3, etc and download when deploy.
I'm recommend don't mixing ui with backend if it possible split project other repository.
Note that RTC has multiple build definition templates. ANT is just one of them. You can also use the Maven build template, the Command Line as well if using the Jazz build engine. If its connected to Hudson/Jenkins for its build functions, you can use those as well.

Is there an analoge to rake tasks in express?

I've used rake tasks in my ruby on rails work in the past, and I'm wondering if the node.js framework express has anything similar. Basically, something that loads the environment and lets you execute scripts.
Have you heard of Jake?
Jake is a JavaScript build program for Node.js, with capabilities similar to GNU Make or Ruby's Rake. If you've ever built projects with Rake, you'll be very at home using Jake

Resources