Angular just show index.html and blank screen after build - html

based on Angular's official website, we should run "ng build" command to create files ready for hosting ( in dist folder ). But after running it, there is no content in index.html. Only the title of the page and if you run it or host it, you will only see a blank page. While if you run the ng serve command, the content will be displayed correctly. What is the problem?
Thanks.

You need to deploy your index.html with a deployment server like nginx server, apache server or angular deploy service, etc…
And make sure that index.html has base url=“/“.
Here you can check how to deplay with angular: https://angular.io/guide/deployment
Or
Apache server: https://httpd.apache.org/

Related

How do I set the root directory for links while editing offline?

I'm making a website that I used to edit directly online on Neocities, but due to some problems, I'm looking to switch my editing to local offline. But I can't make my links point correctly to their targets, such as the favicon or my css files because locally, "/" doesn't point to the root.
Is there any program that allows me to set a folder as the root directory so these links can point properly? I'm currently trying Notepad++ but I haven't found a way to do so.
I know I could put the full path as "C:\folder\folder\file.css" for examle, but that would mean I'd have to edit the html of every single of my many pages and then re-edit them when I upload them online, and that's very undesirable. I need a way to preview the html locally without changing any paths, so my favicon link, for example, which currently is href="/favicon.png" can stay unchanged on all the pages. I could remove the "/" but then it wouldn't work for any pages within subfolders, and there's a lot of those in my project.
It's possible that I'm just missing some simple detail but I'm really just very much a beginner to making websites in general.
You can run a local web server to serve the contents of your root directory at a domain like http://localhost:8080. So rather than opening index.html in the browser you visit that URL instead.
There are a bunch of simple web servers you can use - my favourite for purposes like this is the NPM package http-server. It requires Node to be installed.
Install node
Install http-server by executing npm install -g http-server in your Terminal
Run the http-server by navigate to the website root folder and run http-server in your Terminal
http-server will produce an output that will tell you where to access the site.
Starting up http-server, serving ./
http-server version: 14.1.0
Available on:
http://127.0.0.1:8080
http://localhost:8080
Hit CTRL-C to stop the server

Hidding Servers Filesystem in Gatsby / ReactJS?

I am about to learn ReactJS.
I want to hide the filesystem structure of my server and only show the project root.
If i go to inspect tools in google-chrome i can see where my project is located on my C: Drive.
Wasnt able to find something about it and Ive got no Idea.
Hopefully, someone can help me.
This is because you are using your computer as a server to serve your site so the inspect tools are able to recognize the origin of the code, assets, and images.
Locally, even using gatsby develop or gatsby build (and gatsby serve) you will always be able to see the root of your project, it happens with all web development files, not only in Gatsby.
In a real scenario, where it's a server (with a domain attached, not your PC) that serves the files you will never see the origin because your site will be placed in the /public or /www of your server. To prepare your project to be deployed, you should run gatsby build command, which will create a /public folder in the root of your project with your code compiled, that folder is the one that needs to be deployed.
This is normal in development environment, for deploy your project try one of these approach in root of you project:
npm build
or
yarn build
This command build an optimized version of your project in build folder, after you can upload content of this folder to your www/plulic folder of your server,

Make served Jekyll project accessible within local network

I'm creating a website locally with Jekyll from my desktop Linux. It's connected to the same router as my other devices, I would like to test the site directly from my android but it's inaccessible.
I also tried to serve the _site directory with darkhttpd and it works, I can access it from android. Is there a way to do that with only Jekyll?
You can do this by starting the server with this:
bundle exec jekyll serve --host 0.0.0.0
You can then access the site locally by going to the servers IP and port 4000. It might look similar to this:
http://192.168.1.100:4000
Source: https://zarino.co.uk/post/jekyll-local-network/

How do I get jekyll to run without server?

In order for me to view the site, it looks like I need to run bundle exec jekyll serve and open the server address in my web browser.
How do I go about having the viewing the site without running the command. I've went into the _site and clicked on the index.html file without running the server and noticed this.
Do you have any suggestions on how to go about this? There is no styling and none of the links works.
Is it possible to just place the .md file in posts folder and be able to view it without having to run a server still styled?
Any help would be appreciated.
You can build your static files using bundle exec jekyll build, then all your files will be in _site.
Now you need a server to serve theses static files. You can install something like nginx or apache.
Once it's done you'll want to copy your static files that are inside _site under /var/www/html/ and make sure your server is started with a command like:
sudo service nginx start

Commands to start and stop jekyll site

Which commands do I need to use to start and stop a jekyll site?
I am trying to use
jekyll build
or
jekyll serve
but I only get build and serve folders created instead.
Both commands create a folder containing your website files already processed and ready to make them available using a web server, with the difference that serve also starts a server that should be used only for development only at http://localhost:4000.
So you can "start" a Jekyll site with jekyll build and then using a server to make those files "available" or you can use jekyll serve and then access http://localhost:4000 to browse your website while you develop it.