We Keep Coding

Can php file bundle by webpack like html

WebPack can bundle HTML files and output from the src directory to the dist directory../src/index.html to ./dist/index.html We know this is a static HTML file, but when I use it in my PHP project, it will need to change the index.html to index.php file. Also, I need to change or customize all of the static content to PHP logic or dynamic content. My question is if I need to add a new section or edit something in my main HTML file then I will need to change on ./src/index.html file from the src folder, then WebPack will do bundle again and make an ./dis/index.html file to the dist directory. Then again need to change the same process for the PHP files and change in PHP file for dynamic content.Should I use the PHP file in the src directory and use here PHP functions, logic or something else or dynamic content? Then bundle finally for distribution or final file to dist directory as ./src/index.php file ./dist/index.php
Have any way for use PHP finalize for render/bundle to for distribution?

How can I render a HTML file with side js files using express in nodejs?

I have a index.html file, which i want to send, using
app.get('/', (req, res) => {
res.sendFile(`${__dirname}/index.html`)
});
Also, I have some js files in this directory, which I want to use in HTML by
<script src="./js/index.js"></script>
So, how can I make these js files accessible in HTML?

You can use what #fedeteka suggested.
app.use('/js', express.static('js'));
The example above basically makes any file in the js folder to be accessed by the /js path. For example, if you have your file tree set up like
Main Folder
-----js
----------script.js
----------another.js
----------asmanyasyouwant.js
These files can be accessed by going to localhost:{yourport}/js/script.js or localhost:{yourport}/js/another.js, etc.
If you set it up this way, you can have
<script src="/js/index.js"></script>
as long as you have a file called index.js in the js folder.

Where should I put these strange files in the file structure for Flask app?

So I downloaded a template for a website, with the aim to use it in my Flask app. I know the basic file structure of Flask app is this:
-app
app.py
-static
-images
-image files
-style
-css files
-templates
-html files
But when I opened the folder of the template code, I found all these strange files and I couldn't decide where to put them.
The original files:
So I put the css, fonts, images, js folders into the static folder and left the rest of the files in the templates folder along with index.html (ignore index - Copy.html, that is a copy I made of the original index.html file), updated the paths of css and js files inside the HTML document and executed app.py.
The file ran but most of the text of index.html was not loading and only one image was being displayed. I checked the logs in the command line terminal and discovered that most of the css was not even getting called.
What am I doing wrong? How should I arrange these files?

In your html file you should connect styles in this way:
<link rel="stylesheet" type="text/css" href="{{ url_for('static',filename='css/style.css') }}">

How do I access my files saved onto my express server?

Currently, I can 'upload' my images onto my server with Multer but now, how can I serve that file? If I visit the path which is: http://localhost:3001/public/backend/public/uploads/user-admin-1556247519876.PNG, i get a 404 cannot get.
I feel like i'm just missing a single step but I can't spot my error.

To serve static files such as images, CSS files, and JavaScript files, use the express.static built-in middleware function in Express.
For example, use the following code to serve images, CSS files, and JavaScript files in a directory named public:
app.use(express.static('public'))
Now, you can load the files that are in the public directory:
http://localhost:3000/images/kitten.jpg
http://localhost:3000/css/style.css
http://localhost:3000/js/app.js
http://localhost:3000/images/bg.png
http://localhost:3000/hello.html
Express looks up the files relative to the static directory, so the name of the static directory is not part of the URL.

How to make the node.js server also send js files?

I have a node.js file server running which (when visited) returns a html content. Also in the same directory of the node.js file, there is a javascript file called test.js. Also in the html content being returned, I need to load that javascript file. However in the html content, being returned, which comes out to be called index.html, the script looks like
<script type="text/javascript" src="test.js"></script>
But the server isn't sending the test.js file, its only sending the index.html file, and the script link is loading it relatively from the same directory.
Now I don't want to give the url to the test.js file. I want the node.js file to also send the test.js file, so that it ends up in the same directory as index.html. And then index.html can load it from the same directory.
Is there a way I can specify in the node.js with code to also send the test.js file?
Thanks.

Are you familiar with Express, as dandavis mentioned? Express allows you to set a directory for your static files. See my standard config below:
app
.use('view engine', jade)
.use(express.compress())
.use(express.limit('10mb'))
.use(express.bodyParser())
.use(app.router)
.use(stylus.middleware({
src: __dirname + '/www',
compile: function(str, path) {
return stylus(str)
.set('filename', path)
.set('compress', false)
.set('warn', true);
}
}))
.use(express.static(__dirname + '/www'))
.use(express.logger());
The important part here is second from the bottom. Essentially, Express now knows to look for any assets you specify in your HTML within that static directory. For me, I create a folder titled WWW within my server folder, then add to it my JS, CSS, and images.
For example, say I create the "stylus" folder within my WWW folder, and add to it store.css. My link to that CSS asset would be the following in my Jade template:
link(rel="stylesheet", type="text/css", href="stylus/store.css")
Express knows to look for that asset relative to the __dirname + '/www' path, and thus locates the "stylus" folder and the CSS assets it contains. Hope this helps, and that I haven't ventured away from your intent!