How to create a few demos to show off to potential employers?

<%= @topic_view.topic.title %>
<%= @topic_view.topic.average_rating %> <%= @topic_view.topic.posts.count { |p| !!p.custom_fields['rating'] } %>

I’ve been advised that I need to make a few demos and then upload them to Github, to show to potential employers. Can anyone suggest how to do that, how to create some demo work?

I’ve studied the HTML and CSS sections about 5 times, the JavaScript section around 10 or 15 times, and done the Web Develoption career path course (at codecademy). I guess I am aiming at front-end work since those things are all front-end.

Also, can anyone explain the exact process of showing a demo to employers, is it a demo that is already done, or is it done live during the interview?

Hi @gghhss, for a start I suggest you to take a look at these pages:

You could use Git Hub pages to host your portfolio. And in you resume you could (or should) put the url of your portfolio.

Although, I would also say that it’s better to get your own website with your own custom domain, which seems more professional to me. There are various hosting providers on the big web, but I fail to find relatively cheap ones that allow a server-side language different than php. (If anyone has some free/very cheap one that allow either Java or Javascript/Node.js, please let me know…)

Lastly, I can’t stress enough on how important Git (or any other kind of version control system) is. I wish I was told about it when I started programming 7 years ago at university. I wouldn’t have needed to restart several projects from the beginning because of “breaking changes” :rofl:

2 Likes

Wouldn’t the end of certificate projects on Free Code Camp be sufficient demos of your work?

To directly address your question, it will be a demo that is already done, hosted on your portfolio (Git Hub pages or preferably your own domain) and then providing a link to your portfolio on your resume at the top where all your contact details are like so:

Name:
E-mail:
Phone:
Website: (portfolio link goes here)

There’s not so much a demo during the interview as there will be short code-tests. These questions will be tailored to the position and test both your HTML/CSS and Javascript knowledge, some examples include:
Name the four types of @media properties.
What is the difference between the equality operators == and === ?
Create a for loop that counts from 1-100 and prints the result to HTML.
What does this mean in JavaScript?
Explain the concept of “hoisting”.

There are millions of examples online of front-end questions and so it’s good practice to read up on them because knowledge about these concepts will separate you as someone who understands front-end development from someone who merely knows front-end development.

Note: You might even be given a take-home assignment where they provide you with a list of tasks to complete and submit. These will often check whether you can create a website from a prototype, fetch API’s and the resulting data and use libraries like Bootstrap to accelerate your workflow.

As for how to create sample demos, there’s really only one option for creating sample demos with no work experience and that is to create personal projects. As @simonebogni mentioned, it’s important that these websites are hosted so that employers can test your code in a live environment as they read what is happening under the hood on your Github.

I always recommend creating real-world websites that are either entrepreneurial in design or commercial in design to show to employers as 99% of the time, these will be the websites that you’ll create. For example:

Entrepreneurial - a dating website that connects abandoned pets with potential owners based on select criteria like whether they want a playful or lazy pet, old or young, dog or cat, etc. This is often referred to as a “passion project”.

Commercial - the classic fashion website which has online ordering, navigation, bold hero-image for the front-page, etc. Google any of your favorite clothing brands, find their websites and try to recreate it.

Note: You don’t have to create designs from scratch. Borrow elements from other websites and combine them to create a unique design.

1 Like