iturres / iturres-reactive-portfolio

💼 Discover my 2023/24 ⚛️Reactive Portfolio⚛️, featuring projects from 2022 to today. Explore my work, access my resume, and connect with me using the contact form! Let's collaborate and create something amazing together.

const profileData = {
  aboutMe: [
    '👨‍💻 I am a Full-stack web developer.',
    '📚 Fond of technical, business, self-help and travel books, and more.',
    '🚀 I thrive on collaborating, organizing, and working along peers.',
    "🍀 I'm on my way to realizing my second dream, having accomplished the first.",
    '⌚ I do a bit of watchmaking.',
    '🖥 I enjoy designing web applications.',
    '🙇🏻‍♂️ Currently learning TypeScript, Angular and DSA.'
  ],
  futureLearningGoals: [
    '🥖 French.',
    '🐦 Swift.',
    '🎤 Give technical and soft skills talks.',
    '🏂 Snowboarding.'
  ]
};

---

Do you enjoy reading? 🤓

📚 Here is a curated list of the books I read, that I would like to share with you... 📚

📖 = Books I'm currently reading

🛠️ Technical Books:

• 📖 "The Pragmatic Programmer" - By Andrew Hunt and David Thomas.
• 📘 "ProGit" - By Scott Chacon and Ben Straub.
• 📘 "Think Like a Programmer" - By V. Anton Spraul.
• 📖 "Javascript The Definitive Guide" - By David Flanagan.
• 📘 "Learning React" - By Alex Banks and Eve Porcello.
• 📖 "Redux in Action" - By Marc Garreau and Will Faurot.
• 📘 "The Ruby programming language" - By David Flanagan and Yukihiro Matsumoto.
• 📖 "A Common Sense Guide to DSA - 2nd Edition" - By Jay Wengrow.
• 📖 "You Dont Know JavaScript" - By Kyle Simpson.

💼 Business Books:

• 📕 "The Phoenix Project, A novel about IT, DevOps and helping your business win" - By Gene Kim, George Spafford and Kevin Behr.
• 📕 "The Five Dysfunctions of a Team" - By Patrick Lencioni.
• 📖 "The Effective Engineer" - By Edmond Lau.

🧠 SelfHelp Books:

• 📗 "Feel The Fear And Do It Anyway" - By Susan Jeffers.
• 📗 "Ego is the Enemy" - By Ryan Holiday.
• 📗 "Growth Mindset" - By Carol S. Dweck.
• 📗 "Declutter Your Mind" - By S.J. Scott and Barrie Davenport.

🗺️ Travel Books:

• 📙 "Hitchhiking in The Axis of Evil" - By Juan Pablo Villarino.
• 📙 "Always the West" - By J.M. Romero.
• 📙 "Magic is travelling" - By Aldana Chiodi and Dino Feldman.
• 📙 "A Tango in Tibet" - By Juan Pablo Villarino.
• 📙 "The Alchemist" - By Paulo Coelho.

---

iturres-reactive-portfolio's Issues

[3pt] Update projects json and re-deploy

Update Projects json data

• Add all rails project data.

• Add all project screenshots.

• Improve any UI that needs improvement.

• re-deploy from development once PR has been merged.

---

[4pt] 404 not found -page- component and migrate BrowserRouter to HashRouter

• **Custom 404 Page component for Better UX: ** At the moment when the user uses the URL bar and hard enters a new path, it will trigger the 404.html page that will refresh the page redirecting the user to the portfolio root path aka accessPage i.e /iturres-reactive-portfolio/ path. This is fine but a custom not found page will be better UX.

• Migrate from BrowserRouter to HashRouter: Basically, when deploying with gh-pages, the wildcard (*) won't work, if the user goes to an unsupported URL the NotFoundPage component WILL NOT render, instead, GitHub pages default 404 page will show up. To support the redirection to the custom 404 component, we need HashRouter's technology to render after triggering the wildcard char to route all requests to the index.html.

---

[4pt] Assess portfolio for JSR - follow rubric

Possible changes

Content

• List of skills: Showcase which tools and technologies you’re familiar with (and any other skill).
• Contact details: email address.
• Call-to-action (CTA): There is at least 1 CTA that brings the user to the “contact” section.
• Update form placeholders.

Personal Extra ones

• Update the Apple icon.
• set ENV at repo settings and add deploy file.
• re-deploy.

Rubric

[2pt] Loading state for `LikeButton` UI component

Implement a loading state for the LikeButton UI component.

• This feature will display a loading indicator (spinner, etc) to users while the likes are being fetched.

---

[4pt] Horizontal IDE like Navbar (Desktop Navbar).

For mobile we have the cool opening flower like navbar, However, I would like to develop a navbar that resembles an IDE's files tab.

• This navbar needs to be render only for Desktop version and it will contain all the portfolio pages links.
• The current navbar will contain the links to the pages only for mobile and for desktop it will only have the social media links.
• Follow VScode layout for guidance.
• This will impact the overal layout of the current project, so, make necessary changes on every stylesheet to maintain a nice and delicate design.

---

[2pt] Waving Alien when form submitted (Contact Page)

The current behaviour is the following, once the user fills out the whole contact form, it will proceed to click submit, if all the validations are correct, it sends the data to the server and renders a 'Thank you' message in the submit button.

I want to also render a small alien waving hello next to the thank you button, or even better, within the button.

---

[?pt] Accessibility issues found in portfolio

Status

The portfolio has some critical accessibility issues that must be addressed.

Tools for the job

• Google Lighthouse.
• Contrast Checker.

Areas to focus on:

• Semantics.
• Text Contrast.
• Links.
• Labels.
• Aria live regions.
• Programmable focus management (investigate further).

Notes:

• Navbar toggle needs a clear role and keyboard focus.
• Announce toggle state (open/close) to assistive technologies.

---