Just finished this course right now, and I feel it was really helpful. I want to start a new simple/personal blog now in 2024 and this tool will be very useful for that. Thank you for your time!
First time watching your video's, ill say you are explaining it very well. thanks for your time and efford to helping us out. allready made a website using hugo one time and fell in love with it. As u said, static sites are way faster. easy to manage and light. subbed.
Lovely walk through. Very nice planing and pacing, inserting blocks of texts and clearly explaining the steps, rather than just typing and talking distractedly. Thoughtful work. "How cool is that," indeed!
Very clever stuff - thanks a ton for your excellent walk-thru Adi. I'm sure I can use a static website - I have to think just why and where - but now you've equipped me with all the dev insights I need. 👏🏻👏🏻
Wow. I started doing web "design" in the 1990's with ActiveX Server Pages (ASP) and hand-coded HTML. Style sheets didn't really do much back then either. Hugo gets rid of all the boilerplate coding and will let me put together a decent looking web site super fast. I can focus on the content instead of having to work on my out of date HTML and Javascript coding skills. Thanks very much for doing this class!
Wow, Hugo is very simple to use, very simple to understand and I will use it for my projects in the near future, netlify is very nice, too. Thank you so much for the video!
Awesome ! thanks for this great tutorial, i know web-dev but mostly used plain html-css-js or react.. and choose Hugo for my blog because it's fast and easy to use , thanks again
Excellent video. Exactly the information I was looking for. I'm sure I'll come up with its limitations, like commenting or liking something. But for now, to get up and running for free, its awesome.
Thank you for this video. I want to ask for something. You wrote shell command in Visual Studio. I am using visual studio for Windows and I can't find this command. Which command should I use?
Hi! We’re glad you enjoyed the video. To achieve a smooth transition between light and dark mode in Hugo, you can use CSS transitions. Here’s a basic approach: Define the Light and Dark Modes: Set up your CSS to include styles for both light and dark modes. Use CSS Variables: Define color variables in your CSS for easier switching. Apply Transitions: Add CSS transitions to smoothly change the color properties when toggling modes. Here’s a quick example: :root { --background-color: #ffffff; --text-color: #000000; transition: background-color 0.5s ease, color 0.5s ease; } [data-theme="dark"] { --background-color: #000000; --text-color: #ffffff; } body { background-color: var(--background-color); color: var(--text-color); } JavaScript Toggle: Use JavaScript to toggle the data-theme attribute on the element. const toggleButton = document.getElementById('theme-toggle'); toggleButton.addEventListener('click', () => { document.body.dataset.theme = document.body.dataset.theme === 'dark' ? 'light' : 'dark'; }); This will create a smooth transition effect when toggling between light and dark modes. Hope this helps, cheers!
At 24:33 How do you replace the words instantly with the different cases? I've tried following / converting your shortcuts to windows shortcuts but I can't replicate it (or is it just clever video editing?)
I am learning and watching the video. Thank you very much. You've been through a lot this year. happy new year 2022 I hope that 2022 will be a year where your wishes come true.🌻
Newb here. I found the website updates best, or as expected, when i use "hugo server --disableFastRender". You should see that in the command line reponse if using "hugo server".
A great starter for whom give it a try to HUGO. But i have very simple question :) My default config.toml(hugo.toml) file is toml. Is there a way(probably there is) to change default config to yml like yours? I lost while searching :D
I published it to Github public repository in VS code but it shows no files in my GitHub hugo-demo repository. Stuck in at 40:59. Anyone can help, please?
With a static site generator, you can have different parts that are repeated in different files (these are often called mix-ins). The generator puts everything together, translates from markdown or any other preprocessor, and creates the final page. If you need to change something that is on all pages, simply correct the one file with it and regenerate the site. It will be fixed everywhere needed (if your mix-ins were created well). If your site is just a few pages, using plain HTML and CSS might be enough. But with a blog of hundreds of pages, this will save a lot of time.
Someone that doesn't know how to use HTML, CSS, and JavaScript can create a website using just markdown with Hugo. It's very easy to use and there are many themes for it.
I just stumbled uppon HUGO yesterday and thought... looks like something cool... now I watched some videos, tried it our myself a little. And now I really dont get whats so great about HUGO? I mean if I want to build a static website in a simple way... isnt it by far easier to just use something like Dreamwaver and thats it? If I have to type so much code. Why wouldnt I just use a graphical interface of Dreamwaver and have a static website done in 5 minutes. Especially if you dont want to learn specific html code...
Excellent video. Exactly the information I was looking for. I'm sure I'll come up with its limitations, like commenting or liking something. But for now, to get up and running for free, its awesome.
Whoever is having trouble with configuring YAML file. You can directly create a new file "config.yaml", or "hugo.yaml" and remove the .toml file.
thanks for the tip. i was wondering for a while why my config.yml does nothing lmao
Thanks for the tip. Can use hugo new site --format yml also as -f flag is no longer in use
@@praba.ponnambalam Thank you !
Incredibly simple to follow from someone who had zero knowledge on all of this before, thank you!
You're very welcome!
Just finished this course right now, and I feel it was really helpful. I want to start a new simple/personal blog now in 2024 and this tool will be very useful for that. Thank you for your time!
Great course. Even yt ads are perfectly timed to not be too annoying 👍
First time watching your video's, ill say you are explaining it very well. thanks for your time and efford to helping us out. allready made a website using hugo one time and fell in love with it.
As u said, static sites are way faster. easy to manage and light. subbed.
Brilliant video, and suitable for a beginner. Took me a whole afternoon but learned loads along the way. Thanks!
Lovely walk through. Very nice planing and pacing, inserting blocks of texts and clearly explaining the steps,
rather than just typing and talking distractedly. Thoughtful work. "How cool is that," indeed!
Excellent explanation. Gave me all the info and insights I needed to deploy my first Hugo website. Cheers man
Very clever stuff - thanks a ton for your excellent walk-thru Adi. I'm sure I can use a static website - I have to think just why and where - but now you've equipped me with all the dev insights I need. 👏🏻👏🏻
This guy is a legend , really loved the way he explained the topics , great work 👍
very relaxing method of twaching
Superb video, very well presented and really interesting, fabulous job. Thank you.
Wow. I started doing web "design" in the 1990's with ActiveX Server Pages (ASP) and hand-coded HTML. Style sheets didn't really do much back then either. Hugo gets rid of all the boilerplate coding and will let me put together a decent looking web site super fast. I can focus on the content instead of having to work on my out of date HTML and Javascript coding skills. Thanks very much for doing this class!
I still develop with ASP. Love it. It's so simple. I have moved to my own custom CSS using grid and flex layouts that make developing a breeze.
Wow, Hugo is very simple to use, very simple to understand and I will use it for my projects in the near future, netlify is very nice, too. Thank you so much for the video!
You are welcome!
Best video to start Hugo!
Awesome ! thanks for this great tutorial, i know web-dev but mostly used plain html-css-js or react.. and choose Hugo for my blog because it's fast and easy to use , thanks again
Excellent video. Exactly the information I was looking for. I'm sure I'll come up with its limitations, like commenting or liking something. But for now, to get up and running for free, its awesome.
Pretty nice lesson for beginners. Thank you!
Glad you liked it!
instead of yml file i'm getting hugo.toml files havn't worked with those what should I do
I had the same problem
Run this command instead: hugo new site mysite --format yml
Thank you for this video. I want to ask for something. You wrote shell command in Visual Studio. I am using visual studio for Windows and I can't find this command. Which command should I use?
Thank you for a clear and straight to the point guide on Hugo, only recently discovered this tech and it's damn fun! Cheers again!
It's a bit dated, but thank you for walking me through the first 15 mins of the video!
Great vid. Thanks for sharing.
Thanks a lot! It was a great course!
Excellent video. I'm new to this and i have a question. How can I have a smooth transition of the light/dark toggle mode with this theme ?
Hi! We’re glad you enjoyed the video. To achieve a smooth transition between light and dark mode in Hugo, you can use CSS transitions. Here’s a basic approach:
Define the Light and Dark Modes: Set up your CSS to include styles for both light and dark modes.
Use CSS Variables: Define color variables in your CSS for easier switching.
Apply Transitions: Add CSS transitions to smoothly change the color properties when toggling modes.
Here’s a quick example:
:root {
--background-color: #ffffff;
--text-color: #000000;
transition: background-color 0.5s ease, color 0.5s ease;
}
[data-theme="dark"] {
--background-color: #000000;
--text-color: #ffffff;
}
body {
background-color: var(--background-color);
color: var(--text-color);
}
JavaScript Toggle: Use JavaScript to toggle the data-theme attribute on the element.
const toggleButton = document.getElementById('theme-toggle');
toggleButton.addEventListener('click', () => {
document.body.dataset.theme = document.body.dataset.theme === 'dark' ? 'light' : 'dark';
});
This will create a smooth transition effect when toggling between light and dark modes. Hope this helps, cheers!
At 24:33 How do you replace the words instantly with the different cases? I've tried following / converting your shortcuts to windows shortcuts but I can't replicate it (or is it just clever video editing?)
Thank you for your video! I got it how to use hugo 💕💕
Adi: thanks for this. Is the publishing to a "public" folder or can it be just to /var/www/html/? Thanks.
ALERT !
GREAT CONTENT ! 💥💥
I am learning and watching the video.
Thank you very much.
You've been through a lot this year.
happy new year 2022
I hope that 2022 will be a year where your wishes come true.🌻
I tried to use the -f flag but it still create a .toml file. I tried:
-f yml
-f yaml
-f "yml"
-f "yaml"
--format hugo.yaml
newer versions of Hugo use `--format yaml`
Thanks for the video 🎉
does this course cover how to create a hugo theme/template?
Great video! Thank you :)
This was a great tutorial. Thanks a lot :)
Glad it was helpful!
Newb here. I found the website updates best, or as expected, when i use "hugo server --disableFastRender". You should see that in the command line reponse if using "hugo server".
Thanks, this was helpful!
i don't know why, but i'm having a problem to insert an image as cover, it just doesn't appear. What's wrong?
Excellent! Thank you for doing this.
Glad you enjoyed it!
A great starter for whom give it a try to HUGO. But i have very simple question :) My default config.toml(hugo.toml) file is toml. Is there a way(probably there is) to change default config to yml like yours? I lost while searching :D
-f flag is no longer in use. Instead, use the --format flag. Eg: hugo new site --format yml
Such good tutorial, thank you
Glad it was helpful!
Is it risky to add a theme as a submodule? Because what if that repo gets deleted?
Very helpful, thank you
I published it to Github public repository in VS code but it shows no files in my GitHub hugo-demo repository. Stuck in at 40:59. Anyone can help, please?
Whats the difference between upload hugo by github actions than to do it by netlify?
Hi, I'm trying to add an image but it didn't display it. I have toml file. Someone knows how to solve it? I'm new using hugo template.
Free tools are always preferable over licensed products.
Thank you. +1 for the video
Cheers man!
Thanks for the video!
You're welcome!
AWESOME
so the way to get the yml file is instead of "-f yml" do "--format yml"
you're amazing! thanks
Happy to help!
Good video. Thx!
Please consider making a course about Eleventy, a simpler static site generator.
i get a error with the main-menu - is there another way to write it?
Thank you for help man :D
Happy to help
nice so guide
Thank you sooo much!!
You're welcome!
Thank you!!!!
You're welcome!
Like bro!)
This man uses vscode in LIGHT MODE!!??
thank brother.
You're welcome!
how did you do that ?
This is great, but Touch returned an "unknown" error. I am on PC. thoughts?
touch is a linux command. touch fred.txt just creates a new file, so you can do this in explorer on windows with the right-click new file option
Can someone explain how is using a static site generator easier than plain HTML and CSS
With a static site generator, you can have different parts that are repeated in different files (these are often called mix-ins). The generator puts everything together, translates from markdown or any other preprocessor, and creates the final page. If you need to change something that is on all pages, simply correct the one file with it and regenerate the site. It will be fixed everywhere needed (if your mix-ins were created well). If your site is just a few pages, using plain HTML and CSS might be enough. But with a blog of hundreds of pages, this will save a lot of time.
is there a way to get a static page?
Hugo takes the markdown files and creates a static site. That is the whole function of Hugo.
🔥
I really don't get what's so great about HUGO, I mean if I want to build a static website in a simple way.
Someone that doesn't know how to use HTML, CSS, and JavaScript can create a website using just markdown with Hugo. It's very easy to use and there are many themes for it.
I just stumbled uppon HUGO yesterday and thought... looks like something cool... now I watched some videos, tried it our myself a little. And now I really dont get whats so great about HUGO? I mean if I want to build a static website in a simple way... isnt it by far easier to just use something like Dreamwaver and thats it? If I have to type so much code.
Why wouldnt I just use a graphical interface of Dreamwaver and have a static website done in 5 minutes. Especially if you dont want to learn specific html code...
if your site have 100 pages and you need to change your footer you chage one by one???
Dude Change the Vscode theme this light thing is going to make you blind 😊. BTW Great Course.
37:02
The video is good but I wouldnt say you dont need to know anything, and I wouldnt say everything is simple and for beginners.
Thank you for watching us and for your feedback, we will take it into account.
Cheers!
ewwwwww light theme!
Other than that, excellent tutorial.
i'm totally lost
Nice, like+subscribe
Excellent video. Exactly the information I was looking for. I'm sure I'll come up with its limitations, like commenting or liking something. But for now, to get up and running for free, its awesome.