Is my portfolio ready to land my first Front-End Job?

Hi Guys,

Thanks for checking out my post, FCC has been a brilliant resource in getting me this far and I’m hoping that I have done enough over the last 11 Months to land my first job in Front-End web dev.

I’m hoping to see if there are some pointers and advice you could give regarding my portfolio / Github.

https://samllo.github.io/Portfolio-2021/

I have 4 projects in there the usual weather app, Crud app, RPS game and a responsive timeline.

I’m thinking about beginning to apply for Jnr roles (front end / web development) in the UK but wanted to get advice and feedback before I make the leap?

Any suggestions, recommendation or advice would be greatly appreciated!

Edit: My resume /CV is also included at the bottom of my portfolio if you also had time to pass comment on it.

Thank you!

2 Likes

I quite like the clean look, it’s very modern. Let me nitpick away:

  • I’d add something like a bouncing down-arrow, after the starting animation has finished, to indicate “you can scroll down now”. I was kind of staring at the empty screen for a few seconds because I thought something would appear once the circle is done spinning.

  • I’d remove the circles from the skills section, an employer won’t be interested in whether you think that you’re 70% or 100% proficient in HTML/CSS/etc. Let your projects speak for your skills instead. But that’s just my personal opinion.

  • When opening the page on my phone, the short introduction text with the animation is so big that I can’t read your whole name. Also, the timeline project is not readable on a phone. I only think this is an issue because you’ve described it as “A responsive Timeline”. Maybe you meant “it responds to the user scrolling down”, and I misread it as “responsive = responding to different screen sizes”

  • opening the console, there’s some leftover console.logs on the main page and in the RPS game

All in all, a very neat portfolio. As I said, I can only nitpick.

3 Likes

First of all, your website is AWESOME!!
And the only improvement I can think of is that I need to scroll to find the text. I might mistake it for a loading(verb) page.
I think it’s a very very trendy website.

1 Like

Yeah, I definitely don’t like that I have to wait for the page to load and then have to scroll. It took me a bit to even figure out that I needed to scroll. Why create a puzzle for the hirer? They are giving you 5 seconds to see if you make the first cut, you have 5 seconds of their attention before they decide to move onto the other 127 portfolios they need to look at before lunch. I hate when people force in CSS tricks that interfere with the information. Don’t put spinners in unless you are waiting for async data. Don’t put time delays on the information the hirer wants to see.

I agree that the skill circles are hokey, like these are stats for a video game character. And you probably have more skills. I think a simple list, or a list with logos would be better. To me, this is the most important section of your portfolio, that and the projects section.

For the “About Me” - don’t mention “self-taught”. It can come across as a clueless brag and they can figure it out anyway. I might include an Education section for that. I might consider moving the “About Me” further down and just have an “Objective” section where you just in 1-2 sentences say what type of position you want, less fluff.

I don’t like how the cards overlap on the carousel, but that’s a nitpicky thing.

I couldn’t download your CV. I would have liked to look at that.

4 Likes

HI thanks for taking the time to have good look over it. I’ve fixed the console logs, text sizing and ill look at reviewing those skills circles, i had my doubts!
Ill also add some proper web responsiveness to the last few projects.

The scroll / loader seems to be the biggest off put for people so ill add some down arrows and look at taking away the loader as well!

Any other tips re my github or resume?
Again thanks its great to hear that you like the look of it !

1 Like

Kevin many thanks!

I’ve fixed the CV link, not sure what happened there?!? Again the loader and hidden header seems to be adding confusion to the page your right, ill redesign asap! Ill also look at a table of logos highlighting skills and technologies as you’re right i know more than the 5 listed. Any thoughts on my github / is there anything apparently missing that you would expect from a jnr developer?

1 Like

I’ve fixed the CV link, not sure what happened there?!?

Yep, working now.

Again the loader and hidden header seems to be adding confusion to the page your right

Yeah, just remember what the purpose of this page is. It isn’t to show off your coding skill - do that in your projects. The purpose of the portfolio is to make it as easy as possible to find out about you in as little time as possible.

Your resume - holy crap! 4 pages? I think 2 pages is too long for most people. Try to get it down to 1 page. Like with the portfolio, you want to make it as easy as possible to find the information. Filling it with fluff and irrelevant information makes it more difficult.

Your summary should be one or two lines, just enough to tell them what you are looking for. You can be more descriptive in a cover letter - this is a data sheet.

The skills section is OK - though you might save some space by making it three columns. And don’t include things you are currently studying - either include them or don’t. Don’t list Microsoft Office - they assume you can use basic Word and Excel.

Have less information in the portfolio section, just the basics, maybe just titles and links.

In Employment, any job that is not relevant to web dev should be one liners. They really don’t care about all the details - don’t waste their time. If you think there is some valuable skill you learned that applies, you can mention it in a cover letter or interviews.

All those education entries should be one line, and drop anything that isn’t tertiary level. I would combine the two degrees into one line. I would want to include them because they show you can finish something, and the fact that they are a scientific field is helpful, but beyond that they just won’t care.

You don’t need to tell them that references are available on request - they know.

You don’t need a link to an unformatted version.

For that matter, this should be pdf. If it extremely portable, everyone can open it, and they can’t easily change it. I think it’s good to have Word and plain text versions because sometimes people ask for them, but you don’t need to waste space with this here.

In short, pare it down significantly. There is no reason for a junior developer to have more than 1 page. I should be able to scan your page in 5 seconds and know who you are. Every detail that I don’t care about (at least 80% of what you have here) is a waste of my valuable attention. The hirer is looking for an excuse to skip yours and move onto the rest of the pile - don’t give it to them.

As far as your projects…

I don’t have time to dig into the code too much, but what I see looks OK.

I would want you to keep building apps, keep building increasingly complex apps. Things like shopping list and rps are fine if you have nothing else, but really, they’ve seen thousands of those.

I don’t see anything there with a backend. I know you’re calling yourself frontend, but often they expect at least a touch of backend work. And that would also make it possible to build more complex apps. If you’re working through the FCC material, the “Back End Development and APIs” section will give you the basics.

So, I would say that it is a good start, but you’ll want to build increasingly complex things. I think you also want to get away from the cookie-cutter apps, the ones that everyone does. Try to think up some original ideas. Or maybe it doesn’t need to be original, just not one of the 10 apps that every beginner puts in their portfolio. It doesn’t even have to be a great idea - they are interested in you as a coder, not an “idea guy”.

Or maybe even spruce it up. What about a shopping app with different columns for different types stores? Or that persists in local storage? Or that persists in something like firebase? Or that has a map that shows the nearest grocery stores? Or that has more animation, etc. This is where you can show off - if done with good taste.

2 Likes

HI @samlloyd26 !

Just a couple of things.
I agree with the others about the skills circles.

I have never been a fan of skill graphics like these.

I don’t think it adds anything.
It’s just arbitrary ratings.

Remember that your potential employer is going to rate your skills through a skills assessment and by looking at your projects.

There is no need to rate yourself.

Let your work speak for itself. :grinning:

Also, freecodecamp has tons of great articles on how to write an amazing resume.

2 Likes
  • Some of the fonts loaded from the CSS file are getting blocked because they get served using http. It also seems to cause a delay when loading the page (looks like some of them are timing out). You should look for a font on Google fonts instead. The font isn’t that great anyway. It looks like someone took the impact font and messed with it.

  • The legibility of the about text can be improved. Limit the line length, increase the font size and line height a bit.

  • I agree with what others have said about the skill section.

  • I’m not one for reinventing the wheel but on a page that is meant to promote your coding skills, it might be worth ditching as much third-party code as possible (jQuery and the slider). If you were using a framework and a component library I wouldn’t care as much, but with plain JS on a promotional page, I would suggest coding as much of it as possible yourself. Make the slider a project and use it on the page.

Whenever I click on your project it open in the current Tab , which I personally don’t like . Can u redirect your projects in a new Tab ? Btw this website is cool

1 Like

I do not like the services section also. You can try a card instead of the progress bar. And the text is too much longer to fit on a single line. Every expert developer says that it is recommended to have only 65 to 85 characters on a single line.

1 Like

You’ve done well Sam, nicely done. Some of the other comments are well founded but you can decide what to change. One thought I had while clicking around was: in GitHub I noticed you participated in 100-days-of-code, in Nov 2020 you claim to have struggled with CSS, everything else seems to work for you - while honest, I hope this comment doesn’t work against you - you are a professional now, after all! :slight_smile:

1 Like

A post was split to a new topic: Looking for feedback for portfolio project

Ive been away for a few days and really struck by how much help you have all offered! Many thanks @kevinSmith for taking so much time to write detailed advice this is much appreciated! I spoke to recruiter this morning who said much the same thing re: my CV shorten it and bump the projects to the top!

I’ll also start considering what to build next app wise, i think react might be the next logical step!

@jwilkins.oboe again thanks for taking the time to provide so many resume writing articles these are particularly useful when wrote from hiring mgr perspectives.

@lasjorg Interesting to hear that you struggled with the fonts loading, this was a worry of mine, hence the loading circle. But ill try to ensure this is a smoother process/locally host that first font. Ill also give moving the slider to its own page some thought.

@garry2090 you’re completely right this is such an easy fix!

@carl.d Thanks for your kind words its great to have someone affirm what you’ve been working on and gives you a real boost!

Its great to receive all your feedback. I guess my last question if a little hard to answer is…

Is this portfolio jnr front end dev job ready? Is it within the realms of hireable?

P.S. Ill be sure to scrap those skill circles :sweat_smile:

Learning a popular js framework or library like react or angular is definitely a must.

A lot of applications will ask for that.

Having some react projects would be a good thing.

Well you can always test the market and see what happens.

If you are able to fill out applications and move pretty far in the interview phase, then that’s awesome.

If you fill out 40 applications and hear nothing back, then there is still work to do.

I do agree with the other posters, that having more complex projects will help you stand out more.

But there is nothing wrong with applying for a few jobs and seeing what happens.

That will be valuable feedback too. :grinning:

It looks good, but if you don’t have a frontend framework, preferably React, I would highly suggest that. Especially for exclusive front end.

Applying for jobs is a whole different beast. It can be very draining. I struggled to study and apply for jobs in a meaningful way. It was either study and do projects with half-hearted and inconsistent applications, or study half heartedly and barely code while going really deep into the application process.

Your LinkedIn and resume should both be optimized. Sounds like you’ve got advice on that. Your GitHub readmes should be presentable as well. At least the first few projects you’re showcasing. Add screenshots, code examples, overall concepts, etc. whatever you think is note worthy.

I ended up building a job search bot (https://github.com/ethanvernon/jobsearchbot) that would crawl Indeed and output the results in Google sheets. I only had it search for jobs that were instant apply and had “junior” in the title and that were posted in the last 24 hours. Then I would have it run each morning, apply for 4-5 of the 5-15 that it would find each day, and then go do something else with my time.

I think using this would be a good way to “test the waters” while you get some React projects done. And then once you have React down and some projects in the portfolio, go all out on job applications.

If you don’t have any luck with front end junior roles, I’d recommend starting back end to open up junior full stack opportunities. Those seem to be pretty popular.

Hi,

I really like your portfolio. Please keep us updated on hows your job searching is going. I’m the same in the UK and my plan is to change career just like you! :slight_smile:

Hi Sam, congratulation. I am also a self-learner. Good Luck

Add like a bounching arrow telling people you can scroll down, because honestly I thought it was just a joke so I was just browsing things via my phone to pass time while I waited for it “load”.

I may just be an idiot for that to be honest.

maybe use some @media css to scale your name part to fit a mobile screen

1 Like

This isn’t really a good idea. Here’s why:

Links to cross-origin destinations are unsafe

If you really want to open a link in a new tab right click and hit open in new tab. I don’t think that feature should be baked into any web app anymore