Read Time: 7 min read

Introduction:

Nowadays, lots of people, be it students, university students (including me), a person who wants to change his career or just as a hobby, start to learn Web Development. They start to learn the basics, for example HTML and CSS by watching videos, following some tutorials or even by a book, but after few weeks of learning, when they want to get their hands dirty to code, they feel lost, they can’t make a simple website and they feel frustrated. Some even have the intention to quit after this. 😕

The thing is, you can not only rely on a tutorial and make a professional website after, it’s Ok to watch videos and tutorials, play with the source code provided, but you should not spend most of your time on those videos. You should make some projects (or side projects, per se) on your own, be it a simple ‘Hello World’ title on a blank page, a few sections or even multiple paged websites.

Side Projects?!

Coding is passion

Beginners would think, what is a side project? Why you need those side projects? 🤔 Well, you should first get the hang of the technologies that you want to learn, after that, you should make a decent portfolio website in order to showcase your work and even make a resume while you get more comfortable so when you apply for a job, you have already made some projects that the recruiter or the employer will check. It’s better than to have nothing to show, not even a portfolio, how will they know that you have the knowledge enough to hire you!

“Always practice, learn, code and build something, that’s the way to go further in web development!!” — Me

I myself had to go into some of the struggles that I mentioned at first when I started, I had no idea what kind of projects to build, the next Facebook? No, that’s hard (Really Hard!!). A portfolio for myself? Umm, I don’t have any projects and I don’t know what to write about my knowledge!! These were few stuff that I was thinking when I wanted to code something but I couldn’t.

I also did some basic projects locally just to test my knowledge, which were not that good. I wrote an article about this and my journey to start as a Front-End Web Developer, you can check it out from my personal blog here or on Medium here.

I searched for projects to do, some were hard, I also saw that people are into some challenges, for example, 300daysofcode or 100daysofcode and I was thinking, wow, these people are really advanced that they’re coding every day, and have milestones etc. but suddenly I see a project somewhere from someone which was tagged by 30days30sites tag and few others which drew my attention. 😮

I thought, what this challenge is about? How someone can build a site in one day. But hey, I wanted to build websites anyway, so this seemed to be what I wanted. I applied and started getting the prompt emails in the next days.

So, what’s the 30Days30Sites Challenge?

30Days30Sites Twitter Page

Basically, it’s an awesome challenge, you get a prompt email every day for 30 days, first it mentions what kind of website you should build, followed by some instructions, then there is a ‘demo’ website for that particular kind of site and a handy tutorial about something related to Web Development which could help you while building the websites or at least get some knowledge.

This means that you have the topic of the website, and your imagination is the limit on how you should make the look and feel of the website, the content, colors, you name it, even the technologies that you can use. There are no restrictions.

The Process:

29th Site getting built

The actual process is the most important but at the same time, the most interesting part of this challenge. You start planning, looking at some other websites as an inspiration, getting the text editor ready, grab the images, links, tools and libraries (if needed) that are necessary for the project and get your hands finally dirty!! 💻

As you start the challenge, you might think that getting a site ready in one day isn’t possible or as a minimum it won’t be “cool”, well, no problem, do it in few days (no more than a week though!!). You might also think that a framework like Bootstrap will make your life easier, actually you are free to use it, but I would say that don’t use Bootstrap or other frameworks, do it with pure HTML and CSS so you can advance your knowledge more than just using a premade code.

What I learned?

I learned so many things from this challenge. I have nearly a full knowledge of HTML and CSS, learned new techniques like Flexbox and CSS Grid, making animations, pseudo classes in CSS, using JS libraries in projects and more. I even learned how to make sites responsive to all devices which is so important to know. Two things that I learned after finishing the challenge were SASS/SCSS and Git, which are two important tools to have at your disposal. 💪 I might even go over the codes of some of the sites in the challenge and turn the CSS into SASS if I have time just to practice more in the future.

Feedback! Feedback!! Feedback!!!

Feedback and always feedback :D

One thing that helps me the most while making a website is to post it somewhere like a Facebook group and you’ll get tons of feedback from fellow Developers in order to further improve my site. This challenge’s Facebook group is no exception, it has a community which is awesome!! I basically post a site, write a small description about what technologies I used, what I learned, what needs to be improved and even more. What I get? Many and many feedback from the community. You should be aware that you will probably get many constructive feedback as well as positive feedback, which both helps to make that site better, fix bugs etc. I get good feedback about how cool is that site, I should fix this or improve that etc. 😎

I have to mention that I’m not the only one that took the challenge. There are many other people that are doing it and as they are dedicating their time to check my sites and provide feedback, it’s important and I have to provide feedback for their projects too. I even ask some questions about how they did that ‘something’ and learn how to do it too. It’s so cool. I recommend checking other fellow developers’ sites and provide feedback to their websites and, who knows, maybe you will learn something from their site too! It’s a win-win.

What I made?

After talking about the challenge itself, I should say a few words about the projects or sites that I made too. It’s cool to have nearly 30 projects or websites on your portfolio, some of them aren’t that good, some of them are awesome though (for me!!). I posted some of the awesome ones on my portfolio and also few of those awesome ones are below:

• Photography Website
• Beverage Site
• Fashion Site
• Digital Agency Website (The best one that I made ❤️)

I even have a webpage where I already put all my projects for this challenge there. You can check it out from here.

I host all the projects on GitHub, you can check the repo of the projects from here. All projects have a README file that describe some info regarding a project or what have I learned from that project.

Conclusion:

As a final note, this challenge really helped me to improve my knowledge and learn more as I got through the challenges. This is not the end of the journey though. I’ll still learn many things and build more websites and who knows, I might even get a job soon for all the knowledge that I have. I recommend to take this challenge if you want to build websites and further improve your Front-End knowledge!!

Thanks for reading this post. If you liked it, please leave a comment and share with your friends and family if they want to improve their knowledge too.

Share this post: