This course has been updated! We now recommend you take the Getting a Software Engineering Job, v2 course.

Check out a free preview of the full Getting a Front-End Developer Job course:
The "Building a Portfolio" Lesson is part of the full, Getting a Front-End Developer Job course featured in this preview video. Here's what you'd learn in this lesson:

Jerome recommends including a contact form on a portfolio website so potential employers have an easy way to connect. A portfolio website allows frontend developers to showcase their personality alongside their work experience.

Get Unlimited Access Now

Transcript from the "Building a Portfolio" Lesson

>> This is the part everybody has a question for it. This is the part everyone has a billion questions for building a portfolio that works, rules. You have to showcase your experience and the tools are the major tools needed. What I do, how I do it make sure you put your personality in it.

[00:00:20] Make it exciting while also using design psychology right? So you know when people read from right to left, you know that the handle how hamburger means have nav menus are done. They have nav menus straight across, then when you minimize them they go to the hamburger menu on the right side.

[00:00:38] And then you press and then it comes to drop down, and you know all that. So follow the rules that makes the Internet simple and boring, cuz we do not want our users to think, particularly the HR who has six seconds to look at your website. So you don't want this person to figure out how to work your website, cuz now you are just gonna throw it away next right?

[00:00:59] So you want to put all your content at the top that your introductory pitch. Make it so it's up there, so they'll see that, add your face or don't add your face. But make sure that part is professional and eyecatching at the same time Right? When it comes to your projects, I always vouch on one deep level, like well thought out project over three.

[00:01:23] You see it everywhere. Everybody has three projects that are done a little bit at a time, and they're not even really fleshed out. Essentially they're ugly babies right? And they haven't really done enough to make them stand out as really well thought out apps. You are going to get a lot further doing one app a lot better than you were doing three apps that were just subpar.

[00:01:50] So focus your energy on that. Then the most important part is having a contact form. You do not want to just put your email, cuz that's how you get spam. And you also don't want to be in a situation to where they have to go somewhere else to reach out to you.

[00:02:09] You want to be able to capture that information, capture that user right then and there. This is just business 101, right? You can use a great tool that I like to push and teach my veterans about is emai.js is serverless is focused on JavaScript. You can slide your email right into the JavaScript, and then you can make a form and you can use it.

[00:02:30] Great example, going back to example right here, so here's Adrian. He has eye popping, he says what he's doing a lot of magic going on. You press the screen, look at that, there's magic all over the place. I could play with this for hours right? Now I want him to move this up but this is how he has all his information for quickly for you to look at.

[00:03:01] Scroll down here's a directory statement. You find his tinkering say GitHub or COPPA, here's his projects. Use his portfolio Islam has projects, and he has a crazy Nordic like, what's this? Yeah, crazy Rockbed project, my goodness, okay, cool. And he has sent me a message. I'd love to hear from you where you have some message where you could type and.

[00:03:42] There we go and it works. And has success message. So you wanna make sure that you can do that and capture all the emails so nice clean, simple. Remember, these things are meant for things to be fast now, let me see, Here we go, Jason Savage. This is another project where he's, yeah, his hair does not look like that anymore.

[00:04:19] He's actually a mentor for VWC. His higher, he has a bunch of projects are being automatically pulled in from GitHub. Then he has all the skills that he's using. And a badge, I don't know where that badge come from, but another contact form. This is what you always want.

[00:04:44] You always want a contact form. You want to capture that information. I cannot stress that enough. You do not want them going to a secondary location to find you to find out how to reach you. You don't want them having to go to LinkedIn cuz guess what? They get on your website, they love your stuff, they want to talk to you, and then I got to go to LinkedIn and send them a my message and Bill over here asked them for their opinion on something.

[00:05:11] They go there check out what Bill's talking about on that resume bill, Bill's looking at giving it to go, no go. Then they come back over here and it's like what was I doing? And then they go to the lunch, and then after that, they come back and guess who didn't get a message, you.

[00:05:23] So make sure that everything that you want in your portfolio is there and you have the contact form. Does everybody get that?
>> Yeah, would you say that you should build that portfolio completely yourself, or is it okay, to use something like Bootstrap, semantic UI, material UI something like that?

>> I get this question a lot. I think that as a front end developer, you will get dinged a little bit as your entry level if you use a CSS framework. Cuz I understand I get it, the CSS frameworks make them easy. I absolutely love Bootstrap. You just throw it up and just by using their stuff, you can have a nice looking site within 30 minutes, right?

[00:06:15] I get it. However, when you're looking at today's current UI, the CSS frameworks were created, because how hard it was to do layout. And now we're in a stage of CSS and stylings that you have grid and flex that does a lot of that work for you. So what that says to an HR person is, I don't know if this person understands or the tech lead, I guess would be the person you had to worry about on this one.

[00:06:43] I don't know if this person understands grid or flex, because you're using bootstrap, and bootstrap, doing all that work for them, right? So that's another layer of complexity you're adding to your interview. Remember, you want to influence everything by making sure that hey, the least amount of questions that you get asked when your interview because of what you show.

[00:07:05] And if you use bootstrap or semantic UI or tailwind CSS, which are all great tools to build things with. When it comes to your portfolio's entry level developer, they can get in the way and be a little problematic.