rhodespeter/portfolio

Portfolio website - build without frameworks and libraries

CV Portfolio

Portfolio website - build without frameworks and libraries

You can find the website hosted here.

Current tech stack

• HTML5, CSS3, JavaScript
• BEM naming conventions
• e2e testing with Nightwatch.js
• Continuous intergration with CodeShip

To run tests:

Clone this repo:

git clone https://github.com/RhodesPeter/portfolio.git

Install node modules and run post install script:

npm install

Run the Nightwatch tests:

npm test

portfolio's Issues

Load all images on page load.

Steve's suggestion:

The images that appear when you hover over the project illustrations only load when you hover, so there is a slight delay.

load all the images on page load?

Focus lines

After I've clicked one of the links in the header, it looks like this:

MacOS, Chrome 56

Add burger to fixed header.

Add burger to fixed header. At the moment the burger is only on the top nav.

Open link to projects in a different window

Open link to projects in a different window, at the moment they are redirected which can get annoying.

Make a favicon.ico

Separate page for CV rather than automatically downloading.

Will's suggestion:

Can I have the option for people to view the CV rather than it downloading automatically?
On this page I could have the link to download the CV.

Improvements to portfolio projects

Jen's suggestion

1. The autocomplete app's background is beautiful. But (on my mobile at least), the background jumps downwards whenever I enter a new character - probably in relation to the drop down box containing he suggested words. Hopefully just a little thing to fix. Just gives a bit of an impression of the site being broken atm.

2. The drawing app doesn't work - that's probably only on my mobile? But just a heads up, in case that matters to you

3. Hacker alias is relatively self explanatory, but a short bit of text to say what a user is doing on that page might be a nice addition? Just like: '
   'Enter your name to get your new alias'

Edit 'about/summary' text

Jen's suggestion

"your 'about' description is really nicely worded but tbh I think you should sell yourself a bit more
Hmm..not the about bit necessarily, maybe just the summary bit at the top.

It kinda sounds like "i've been coding for 16 weeks, I used to be a designer, one day I want to be a good at coding"

Try screenshots rather than illustrations.

Tom's suggestion. Could this just be for the images when you hover over them and not all the time so the design stays clean?

Slow down scrolling speed

Tom's suggestions:

Slow down the scroll speed from the top links.

Error retrieving a new session from the selenium server

Came back to the project and ran nightwatch.js tests, no code has been changed from when the tests were last run and I have this error in my terminal:

peterrhodes (master *) cv-portfolio $ npm test

> [email protected] test /Users/peterrhodes/Desktop/cv-portfolio
> nightwatch --config tests/nightwatch.conf.BASIC.js

Starting selenium server... started - PID:  52034

[Tests] Test Suite
======================

Running:  Assert Title

Error retrieving a new session from the selenium server

Connection refused! Is selenium server started?
{ Error: getaddrinfo ENOTFOUND localhost localhost:4444
    at errnoException (dns.js:28:10)
    at GetAddrInfoReqWrap.onlookup [as oncomplete] (dns.js:76:26)
  code: 'ENOTFOUND',
  errno: 'ENOTFOUND',
  syscall: 'getaddrinfo',
  hostname: 'localhost',
  host: 'localhost',
  port: 4444 }

Link to GitHub and the site?

Jen's suggestion:

From an employer's perspective, it might be nice if the boxes listing the technology (e.g. 'html CSS tape javascript') were click able and took someone directly to the github repo, so they can look through your code too? and then one for the hosted site.

At the moment they just link to either GitHub or the site. How about both?