lain teaches you how to code
Summary
TLDRIn this instructional video, the creator shares their experience building a website using NeoCities, a free hosting platform. They emphasize that even beginners can easily learn coding with HTML, CSS, and Java. The video offers a step-by-step guide on setting up a domain, editing the site's code, and creating a stylesheet for consistent design. The creator also encourages viewers to explore other NeoCities sites for inspiration and to share their own creations, highlighting the joy of self-taught coding and the importance of responsive design.
Takeaways
- 😀 The speaker shares their experience in coding a website from scratch, emphasizing that it's not as difficult as it seems, especially with knowledge of HTML, Java, and CSS.
- 🌐 The recommended website for hosting and creating a free URL is NeoCities, which is user-friendly even for beginners.
- 🔒 When choosing a URL, be certain as changing it later might affect website traffic since old links won't automatically redirect to the new URL.
- 📝 After signing up, the user will have access to a dashboard with options to edit their site, visit it, and check traffic and activities.
- ✂️ Editing the website involves navigating to the 'edit' option, which leads to the backend where the HTML code can be manipulated.
- 🎨 The speaker suggests creating a stylesheet for consistent formatting across the site, which is a foundational but time-consuming task.
- 📚 Having a stylesheet in place provides a solid groundwork for the website, making further development more organized and efficient.
- 💻 HTML was found to be an easy language to pick up for the speaker, even with no prior coding experience, and was learned within about a month.
- 👀 NeoCities also offers the opportunity to view and draw inspiration from other users' websites, which can be a valuable resource for new creators.
- 🌟 The speaker's website took a year to complete, involving late-night coding sessions and a focus on responsive design for various devices.
- 📝 The speaker encourages others to try coding and website creation, sharing their enjoyment of the learning process and the freedom it offers to learn at one's own pace.
- 🔗 A link to the NeoCities website will be provided in the description for those interested in creating their own website.
Q & A
What is the main topic of the video transcript?
-The main topic of the video transcript is teaching viewers how to code a website, specifically using HTML, Java, and CSS, and utilizing a hosting site called NeoCities.
What does the speaker suggest for beginners who want to start coding a website?
-The speaker suggests that beginners don't need to worry because they were also a beginner when they started coding their website. They emphasize that HTML, Java, and CSS are the main skills needed, and that the process is not too hard.
What is NeoCities and how is it used in the context of the video?
-NeoCities is a hosting site where users can host their own URL for free. The speaker used it to create their website and recommends it for its ease of use and the ability to view and get inspiration from other people's websites.
Why is it important to choose a domain name carefully when signing up on NeoCities?
-Choosing a domain name carefully is important because changing it later might affect the website's traffic. If the URL changes, people may not be redirected to the new URL, potentially losing visitors.
What does the speaker suggest as a good starting point for coding a website?
-The speaker suggests starting with an 'edit' button to access the code behind the scenes of the website. They also recommend creating a separate stylesheet for the website's formatting, which serves as the groundwork.
What is a stylesheet and why is it important for a website?
-A stylesheet is a separate file that contains the formatting for a website, such as fonts, text boxes, decorations, and image backgrounds. It is important because it provides organization and consistency across the website, and it saves time by not having to repeat the same code on every page.
How does the speaker describe their experience with HTML as a beginner?
-The speaker describes their experience with HTML as quite easy to pick up, even with no prior coding experience. They mention that they were able to learn HTML within about a month.
What is the speaker's advice for those who are interested in making a website using NeoCities?
-The speaker advises to comment on the video if viewers decide to make a website using NeoCities, as they are interested in seeing others' work and have not met many people who have used the platform.
What did the speaker find challenging about coding their website?
-The speaker found creating the stylesheet to be the most time-consuming and challenging part of coding their website, as it involved writing almost 900 lines of code and ensuring the site looked the same on both desktop and mobile devices.
What did the speaker enjoy about the process of learning to code and creating their website?
-The speaker enjoyed the learning process itself, as they were able to go at their own pace and learn whatever they wanted. They also enjoyed the challenge and the sense of accomplishment that came with figuring out how to make their website work.
How does the speaker plan to share the link to NeoCities for those interested in making their own website?
-The speaker plans to leave the link to NeoCities in the video description, making it easily accessible for those who are interested in making their own website.
Outlines
📝 Introduction to Website Coding with NeoCities
The speaker introduces a tutorial on how to code a website, emphasizing that it's not difficult, especially with prior knowledge of HTML, Java, and CSS. They share their personal journey as a beginner and introduce NeoCities, a free hosting site for creating and hosting a personal URL. The speaker advises on choosing a domain name carefully due to potential traffic impact if changed later and provides an overview of the site's initial setup and profile editing options.
🎨 Creating a Style Sheet for Your Website
The speaker discusses the importance of creating a style sheet for a website, which involves defining fonts, text boxes, decorations, and backgrounds. They share their experience of coding a style sheet that took a significant amount of time and effort, resulting in nearly 900 lines of code. The speaker suggests that while it's possible to include all styling in the index page, creating a separate style sheet is more organized and efficient, preventing the need to duplicate code across multiple pages.
🌐 The Benefits of NeoCities and Encouraging Exploration
The speaker highlights the benefits of using NeoCities, such as the lack of cost for hosting a personal site and the opportunity to draw inspiration from other users' websites. They encourage viewers to explore different sites on the platform and to check out the links provided on their own website. The speaker also shares their personal experience with coding, mentioning the challenges of ensuring their website's consistent appearance across different devices and the enjoyment they found in learning to code at their own pace.
🛠️ Reflecting on the Coding Journey and Offering Resources
In the final paragraph, the speaker reflects on the overall coding journey, which took a year of focused work and involved late-night coding sessions. They express satisfaction with the learning process and the fun they had in creating a responsive website. The speaker offers to look at viewers' websites if they decide to create one using NeoCities and provides a link to the website in the description for those interested in making their own site. They conclude by thanking the audience for their attention and expressing the need for rest.
Mindmap
Keywords
💡Coding
💡HTML
💡Java
💡CSS
💡NeoCities
💡Domain Name
💡Stylesheet
💡Responsive Design
💡Inspiration
💡User Experience (UX)
💡Self-Learning
Highlights
Introduction to the process of coding a personal website and its accessibility even for beginners with no prior coding experience.
Emphasis on the importance of HTML, Java, and CSS for website development.
Recommendation of the 'NeoCities' website as a free hosting platform for personal URLs.
Advice on choosing a domain name that reflects long-term commitment to avoid traffic issues.
Description of the initial profile setup on NeoCities after signing up.
Explanation of the 'Edit' feature on NeoCities for customizing the website's backend.
Discussion on the importance of creating a separate stylesheet for website formatting.
Personal experience sharing on the time-consuming yet foundational nature of creating a stylesheet.
The speaker's testimony on the learning curve of HTML and its ease of pickup for beginners.
Mention of the benefits of NeoCities, such as no cost for hosting and inspiration from other users' websites.
Encouragement for viewers to create their own websites on NeoCities and share them with the speaker.
Reflection on the speaker's personal journey and the time investment in creating a responsive website.
Highlight of the challenges faced in ensuring the website's consistent appearance across different devices.
The joy of self-paced learning in coding and the speaker's enthusiasm for sharing their experience.
Invitation to the audience to follow the provided link in the description to start their own website journey.
Closing remarks with gratitude for the audience's attention and well wishes for their day or night.
Transcripts
hello um today I will be teaching you
how I coded my
website and honestly it's not that
difficult especially if you have prior
knowledge of coding specifically stuff
like
HTML some Java depends on like what
you're going to do on your site and CSS
and if you know like those three things
then you should be set and also if
you're a beginner don't worry cuz I was
also like a full on beginner knew
nothing about coding when I started my
website so don't worry it is actually
not too
hard okay
so let's get
started um so basically
I used this website and it's called neoc
[Music]
cities it should look like this when you
first go to the landing page and it's
going to ask you to sign up and
basically what this site is it's like um
it's basically just like a hosting site
where you can just host your own URL for
free and it's really really nice
um so yeah what you want to do is you
first sign up for like your domain name
and you know you put your information
and you make a password and oh yeah also
when you choose the URL for your website
make sure it's something that's like
that you actually are sure about
it like make sure that you're actually
sure about the name that you choose
because you while you can change your
url at any given point um it might
affect traffic to your site because if
you change the url then people will not
like they won't be redirected to your
new URL so you should be careful about
that so yeah um once you sign up you're
going to you're probably going
to like your
page after you sign up should
could look something like hold on my
Wi-Fi is being a little slow
but your profile should kind of look
something like this it might be a little
different cuz mine already has all of my
stuff in it but you should have
something similar to this as well and
there's going to be like a little edit
button oh yeah and the little directory
to like go to everything is right here
where you're using username is and if
you click on that there's like a little
drop down and it has a bunch of
different options for different things
you want to do like editing your site
visiting your site looking at like your
site profile looking at traffic
activities stuff like that and so
basically these two red buttons here
you're going to want to click on
edit and once you do
that it should redirect you to like
basically behind the scenes of your
website and yours is probably going to
look very different from mine cuz I have
like a bunch of different pages and I
have like images and stuff that I added
in so it's like there's a lot going on
but yours probably won't look like this
and you'll probably only have like maybe
like I think you have like a picture of
like the Neo cities cat maybe and then
like your main index page
and that's just going to be blank with
like the neoc cities logo and some
coding tips and so basically if you
hover over like that index page they'll
have like a couple options I think I
think the first one should be edit if
you hover over the
little the little like rectangle and
once you click on
edit I'm just going to click edit for a
random page it should take you to like
basically all the codes code that's in
your website and for me I have like a
lot of stuff okay well not for this page
specifically
but I do have a lot of stuff going on
and yours again probably won't look like
this it'll be a lot simpler and this is
basically where you start and oh yeah
tip is you should probably make a Styles
sheet and for people that don't know
what I'm talking about it's basically
like um um you make like your own
formatting which I also had to do which
took very very long and I can show you
cuz once if you like have like the style
shet done you basically already have all
of like the groundwork to your site done
basically but this is also like the most
time consuming and the most hard part
so yeah let
me let me show you what my style sheet
looks like so basically it's just like
the groundwork for your website so for
me I have like different fonts like
different text boxes you know like
different decorations that I like
different image backgrounds like
everything is in here which is why it is
really really long it is very very long
lines of coat is this this
is almost 900 lines of code that I had
to do myself
and yeah
this this was literally the death of me
like
this this was very stressful and you
don't have to do this honestly I've seen
people who don't make like a stal and
they just include like everything just
in the beginning like in their index
like on their index page they have like
everything just on the top first
and honestly you could do that but I
would recommend making like a separate
thing for it cuz it's just easier and
it's more organized and you don't have
to like copy and paste all of that code
into other Pages cuz it won't transfer
over so
yeah and what else so that's like the be
like minimum I guess that you should
know and
okay like like I said
this the way that you code is using HTML
so
honestly like me having zero coding
knowledge when I first started my
website HTML was actually quite easy to
pick up for me at least I don't know if
that's like I don't know if HTML is just
like easy in general cuz like I said I
literally don't have any experience in
coding other than just what I've been
doing myself so yeah but in my opinion
HTML was quite easy to pick up I think I
picked it up within like a month or so
and yeah um what
else the thing the great thing about
this like website like Neo cities is
again like you don't have to pay to have
your own like little site domain thing
up and also you can also look at other
people's websites and get inspiration
from them too cuz I got a lot of
inspiration from a lot of different
sites and I actually have them linked in
my website cuz they're cool you should
definitely check them out but yeah
there's a lot of like there's a lot of
different like types of websites like
different topics people talk about the
way it's like designed it's so unique
and I just I really like just scrolling
through and seeing what other people are
up to cuz it's really fun but yeah and
oh yeah if you decide to make a website
using this you should comment it and
then I'll go take a look at it cuz I
don't know anyone else who has a neoc
cities website like I I'm the only one
like I mean like of course there's other
people but like I haven't met anyone
that's coded on Neo cities before so
yeah but I think I think that's
basically all I wanted to talk about cuz
um for the rest of
this um it like the site itself kind of
walks you through everything so it
shouldn't be that hard but yeah I just
really wanted to share this because lots
of people have been asking
and yeah I thought why
not and also this is a really a good
excuse to pull out my my lean cosplay
because I don't know I have no other
reason to be wearing stuff like this
right now but
yeah I hope this helped
you
I my website is
like basically a Year's worth of
work yeah it did it took a very long
time and I was very very focused on it
for a long time like I would stay up
until maybe like 4: or 5: a.m. just
coding and trying to get like one line
of code to work perfectly because oh
yeah the special thing about my website
is that it looks the same on both like
desktop you know phone like it looks the
same everywhere and that took so so long
to figure out cuz
yeah not having any prior knowledge of
coding it was really rough it was it was
really rough but yeah I honestly had so
much fun learning though I love learning
stuff on my own cuz then I can go at my
own pace and I can learn whatever I want
so yeah I don't know for coding in
particular I did have a lot of fun so if
you want to make your own website or you
just want to get into coding or you just
want to do some stuff for fun I
recommend what I just showed you today
and I hope this answered a lot of
people's questions and I'll leave like
the link to the website in the
description so if you want to like make
your own website it'll just be right
there
and yeah thank you for listening to me
blobber about stuff I
like um
yeah I hope you have a good day a good
night a good
[Music]
whatever
yeah
yeah sorry I don't know what to say now
but yeah I hope this helped you and I
need to go to sleep because it is very
late
Ver Más Videos Relacionados
DESENVOLVENDO MEU PRIMEIRO SITE COM HTML | 4#
How to Create a WordPress Website in 10 Mins 🚀 (Watch Me Live 🔴)
How to create a Website in Google Sites for Free
Figma To Real Website | Responsive Homepage | HTML, CSS & JavaScript | Part 3
I Built JavaScript-Powered Minimap Scroll Animation
Responsive HTML Table With Pure CSS - Web Design/UI Design
5.0 / 5 (0 votes)