
Ask HN: As a Front-End Dev., what should I show on my portfolio? - cangoktas
I&#x27;m a Front-End Developer with 2 years of experience and I guess it&#x27;s time to build up my personal portfolio website but I&#x27;m not sure about what to show there. I can&#x27;t just show pictures of websites and apps I&#x27;ve made, that makes no difference between the designer and me. And also pictures don&#x27;t really reference the job I&#x27;ve done.<p>I can&#x27;t also just post links of the stuff I&#x27;ve done because many of them changed the design or f--ed up the front-end after my work or the apps are no longer active. So I don&#x27;t have much works that are live right now.<p>Should I just write down which languages&#x2F;frameworks&#x2F;tools I use and how good am I at them? That would be good for the people who understands the development process, but &quot;regular&quot; people that I can get freelance jobs from will not understand anything from &quot;I&#x27;m pretty good with HTML5 and improving myself on AngularJS&quot;.<p>I&#x27;m totally mindblown right now and open for your suggestions. Also I&#x27;d like to see other Front-End Developers&#x27; websites, please.
======
lifeisstillgood
Try this:

A dual column layout : on the left a screenshot of each of your best work and
on the right a written explanation of why what you did benefitted the client.
Turn each one into a three or four paragraph case study of why hiring you
helps the project manager, Dev Lead or business owner.

A write up should cover the business need (40% of people who started filling
in the quotation form did not complete. I rewrote it in AngularJS reducing the
number of screens, improving response time and auto-filling some sections, and
the completion rate rose to 78%. This gave an increase in leads of 30 per
month)

Or

After their original contractor failed to complete, XXX hired me with two
weeks to delivery to finish the site in time for the restaurant opening. After
a full and frank day of discussion and designs we had agreed a reduced feature
set which I delivered in time.

If at any point you can work in something like "this site is written in
AngularJS which enables professional looking functional work like this to be
created in less than 15 minutes - see this wistia video for a screencast where
I show you" you get extra points.

Basically sell the benefit to the other person, not show how much you know
about JavaScript. The person wining the cheques does not even know what a
curly brace is for and so assumes you are an expert already.

Ps - put a big professional photo of yourself I the site, smiling. That seems
to be a thing now on freelancer sites

------
jcrotor
I think the portfolio site itself should show off your skills. As a front-end
dev, it isn't enough to just have clean, semantic HTML and clean css and js.
You are getting ready to build a site where you can and should experiment with
various technologies that you have interest in, but haven't had the
opportunity to use them in a project yet.

Have a section dedicated to "current front-end experiments" where you just
build cool stuff and show it off. Take things you are particularly proud of,
try to abstract them to their core idea, and throw it on github.

I am going to agree with another user that you need to show proficiency with a
front end framework, either Angular, Backbone, or Ember.

Also, a blog attached to your site where you discuss working on your
experiments is nice too.

What do you currently send prospective employers when you apply for jobs as
far as code? Throw that up there too.

I've been applying for jobs recently and don't have a portfolio site. I've
been getting interviews just from my resume,one project that I built start to
finish that I still manage, and a few small angular apps that are super
simple. So if you would rather build a functional purpose built site, that is
OK too.

I am not saying that devs shouldn't have portfolios, but I feel that they are
more necessary for a designer, because that is one of the only ways they CAN
show their work.

------
fenier
I do not know your specific audience which would see this site, are they
customers directly, or would you be using this to show work to get hired at a
company?

These have slightly different focuses. A customer centric site I would think
would focus on things you can do which would help the customer. For example, I
setup a Wordpress Install, which automatically does X, and the theme matched,
etc. These people are unlikely to do a in depth technical review of what
exactly your code looks like.

A company on the other hand, will tend to pay more attention to it. They could
run your HTML through a validator, look through your CSS, and evaluate your JS
coding style at minimum. They could also run the site through Pagespeed, or
webpage test. They could check not only if all the above is done properly, but
that you are leveraging caching, concatenation, and minification. They are
much more likely to ask you very specific questions on the above.

In general however, I find that just listing your technical skills is 'OK',
but writing a brief statement of the skill, and what it allowed you to do, is
likely to get you better results.

------
gbuckingham
Your point about your work being taken offline or altered after hand-over is
important here. Make a habit of including in your contracts that you are
permitted to keep a copy of the work for demonstration purposes (where
possible) and use that for demonstration.

Don't aim to show all of your work. Instead, select your best pieces which
demonstrate the depth of your skill for each of the key areas you wish to
demonstrate you can do. Select pieces based on the complexity of the project,
or the way you approached it. I would recommend including a picture of the
site/product as a companion to a succinct description of the technologies and
frameworks you used. Include the benefits of the solution you implemented.

------
jvickers
You could show some relatively small (such as 600x250) images of parts of live
sites that you have worked on, with those images showing some parts that you
feel more responsible for having done, without having done the whole site.
Those images would also link to the sites themselves. They would have a small
caption saying what you actually did for that website.

------
sova
make it pretty

you don't have to have soft-ware-ified things to show your design skills. you
design and then code-ify. the physical portfolio can look kickass in a binder
with some glossy prints. you don't need to list tons of sites so people check
all your pixels or css lines, but so people get an idea of your creativity and
passion

if you can present someone with a pretty tome of cool web-esque ideas they'll
probably see you're legit.

just think of this as another project =)

my friend's buddy applied to this advertising firm's designer team lead
position and his resume was the only one that was completely pink (pink
paper). he got the job so.

it's the little stuff

------
CmonDev
A gallery of apps developed using Front-End technologies (Qt, XAML, Xamarin,
Cocoa, Android GUI API etc.). Demonstrate the ability to choose the right tool
when GUI quality is not important (HTML) or is important (native).

~~~
sehr
It's pretty obvious they're talking about front end web development.

~~~
CmonDev
Are you sure though? "...show pictures of websites and _apps_ I've made..."

~~~
sehr
Ah true, didn't catch that. Saw angular & HTML5

------
vishalchandra
Demos of front-end AngularJS modules.

