Feedback Portfolio - Internationalization?

Code Feedback
1

Hello,
I started to create my portfolio and i’m looking for some feedback, since i will link this website on my resume when i’m applying for jobs this year!

You can find my website here : Portfolio

Please give me feedback about the way it looks and feels! I mainly use chrome for development but i also would like it to work in other browsers. So if you use something different make sure to leave me a hint!

I’m also looking for a way to translate my page into at least English…, what kind of Options do i have? I’m using nodejs in the backend to send me the e-mails from the contact form

thank you!

2

Your portfolio is awesome! Only three things:

  1. The section Über mich not works.
  2. Highlight yours skills.
  3. English version.
3

Internationalization is tricky.

One easy way is to use a library that lets the page automatically translate through an engine like google translate. It is easy because as you make changes to the original page, the translated pages will be automatically updated. That is easy. The problem is that you can’t trust the translation. Really, it can be bad. I’ve had to work on some of these and the client keeps getting mad that the translation is sometimes incomprehensible.

Another (better, imho) is to use a library like i18next. With this you create a file (like maybe a json file) for each language. You use the different properties (and can even nest them) to refer to different sections of text. Then in your code, instead of writing out the text, you call a function that retrieves the correct text depending on what language is selected. It has the added advantage that you get all that text out of your code. You have the responsibility of creating and maintaining the translations. It’s more work but you have complete control. It also looks a lot hipper to a prospective employer. Really, this is the way to do it. And it would be a good skill to have on your resume.

4

Thank You! I’m working moste of these! What do you mean by highlighting my skills? Isn’t it enough to show which technologies i used at those projects?

5

Do you have hands on experience with i18next? I had a first look into it and it seems to be a little overkill for my portfolio. It like to add it since it is a good to know technology.

6

Calculator is broken in Firefox. Also 0.1 + 0.2 = ? (and nasty scrollbar).

“Eine Produkseite” is misspelled.

I’d recommend for pure frontend apps to use something like GitHub pages, because Heroku apps take a while to wake up (15…20 seconds) and it’s not a good UX.

And capital city of Croatia is “Zagreb” not “Zegrab” :smile:

7

Yes, I’ve used it before. It’s an excellent tool and similar to how i18n is handled with other libraries? You think it’s overkill. I disagree. But even if it is, it’s a great learning opportunity and a chance to demonstrate a marketable skill.

8

Yes, i know the Calculator doesn’t work good with decimal and large numbers. What is not working in firefox? I tried it and it seems fine.

Thanks for the spelling error. Most of the pages are hosted on heroku because they were projects in my university and we were forced to use heroku. But i agree its bad UX although I don’t think someone actually uses them and only start it when they want to check out my projects…

I will tell my partner xD about Zagreb haha. He was in charge of the cards :smiley:

9

Exactly, and their first (and only) impression won’t be good. Someone may even decide that the app is broken and close the page without even waiting those 15 seconds.

Firefox:

calculator_firefox
calculator_firefox600×721 18 KB

10

ok, i will try to use it. I have already implemented i18next with a corresponding backend. But somehow the browser languageDetector requests always (en) and not (de) if i change the browser language… it’s probably going to be a longer ride :smiley:

11

I don’t think this would require a backend.

12

I’m not sure if I want to be hired from someone who doesn’t know heroku XD

I will see if i can fix that… for me firefox seems fine.

13

Exactly. This is to show your recruiters what you are capable of doing and what technologies you have used. Another option is to show in a section a list of technologies with their logos.

14

My site is in English and I write my cover letters in German.
Keeping a personal site up-to-date in multiple languages is annoying,
especially if you write some blog posts.
It also shows that you are able to write and speak in English.

15

That’s a good approach too. Although It would be fun to learn a new framework, it think i’m going with this idea.

16

I think you should improve the contact form more beautiful .
A little not UX , i think.

I also work some projects which related to leafletJS, looks so interesting

17

I look at the site and is that how to not create manual. And looks like the joined service locize is payed.
I make that in JS. You can also make these as JSON object {button1: plus, button2:minus} and then with jquery assign to the right element

const textGE = "germantext"
  const textEn = "englishtext";

$(function () {
  var language = window.navigator.userLanguage || window.navigator.language;
  console.log(language);
  language.includes('En')?  $("#blockquote-text").html(textGE): $("#blockquote-text").html(textEn);

  $("#flagGE").click(function (e) {
    $("#blockquote-text").html(textGE);
  });
  $("#flagEn").click(function (e) {
    $("#blockquote-text").html(textEn);
  });
  });

The output you can see in my portfolio with flags bottom of site
https://lubodrinka.github.io/Personal_portfolio/

18

I agree, the form isn’t that beautiful but I just suck at design and i think it fulfills its purpose.

What exactly do you don’t like about the form UX?

Leaflet is awesome! It has stille some ways to improve but i used it already in multiple projects!

19

Hello, yes this would be a way to do it too. I wonder why i18next would be better tho.