Post-Image

Creating my new portfolio

Posted on

I just finished cleaning and organizing my websites.

First of all I finally settled on a portfolio website after the 4th try.

(You can find my other attempts here: http://alpha.robinio.ch/http://beta.robinio.ch/ and http://gamma.robinio.ch/)

Furthermore I updated and cleaned up this blog. Sadly a few images in the older post are magically gone so I’ll be looking into that at a later moment.

2014-07-24 03_32_53-Bootstrap

Back to my new portfolio. As a frontend framework I used Twitter Bootstrap because it has a really handy grid and some other awesome features.

2014-07-24 03_32_01-Bootswatch_ Cosmo

But because the vanilla Bootstrap theme isn’t that good looking, I am using the Cosmo Theme  from Bootswatch. This Website is really great if you want to prototype a website fast.

2014-07-24 03_33_32-Devicons _ The developer's iconic font

For my Iconset I am using Devicons for my skill set and Font Awesome for everything else.

2014-07-24 03_52_02-Robin Glauser _ Portfolio

I wanted to give my visitors the possibility to contact me with a contact form. To do this I needed three things.

  1. A user-friendly frontend validator
  2. Backend validation with a simple framework
  3. And some security like a captcha

To accomplish this I used Bootstrapvalidator for the frontend validation, Silex as a simple framework for the backend validation and Silex-Captcha for the captcha implementation.

The setup for the Bootstrapvalidator should be quite easy as there are many simple examples in the documentation.

You can also peek at my configuration in my Github Repository.
https://github.com/nahakiole/robinglauser.ch/blob/master/js/main.js

The backend setup is quite easy. First download the dependencies via composer. (Silex and silex-captcha)

{
    "require": {
        "silex/silex": "~1.2",
        "kilte/silex-captcha": "~1.0"
    }
}

Then you could use my app.php as a template for your website. Essentially the script check’s if the captcha is valid,  if the data is valid and then sends the mail with the comment.

You can find all of my source code on Github.

https://github.com/nahakiole/robinglauser.ch

And that’s about it. If you have any questions please comment and I’ll get back to you.

Leave a Reply