DEV Community

Cover image for This is all the tech stack I used to build my portfolio website
Sadeedpv🥇
Sadeedpv🥇

Posted on

This is all the tech stack I used to build my portfolio website

Last week I completed my portfolio website and this is all the tech stack I used to build the website which could be helpful for your next project. Before that, here is the link to my:

Ok, let's get straight to the point.

I used React as my front-end framework. If you are a beginner and want to learn React, these are a few of the best sources I could find on the Internet.

  1. I used Framer-motion to integrate animations into my website. If you want learn Framer-motion, this you-tube playlist by NetNinja contains all the information you need - https://www.youtube.com/watch?v=2V1WK-3HQNk&list=PL4cUxeGkcC9iHDnQfTHEVVceOEBsOf07i.

  2. I used shoelace.js as my component library. If you want to dive deep into shoelace.js, here is the link https://shoelace.style/frameworks/react

  3. React-icons - I used this npm library to create all the icons you could see on my website 🤠. They provide bootstrap icons, Font-awesome, and Iconsicons. etc

  4. Framer-motion with React-intersection-observer library enables you to display animations on scroll ✨.

  5. This shadow generator helps you to create shadows of your desired style https://shadows.brumm.af/

  6. I used undraw for adding illustrations to my website (https://undraw.co/illustrations).

  7. react-parallax-tilt - This library is very useful in creating tilting animations on hover 🚀

  8. Finally, I used Figma❤️ for prototyping which is a tool that I highly recommend you should learn if you are a front-end developer. It is a powerful tool that helps you to create anything. It is easy to learn and you can find tutorials on youtube.

Thanks, and that's all the technology I used to build this website. Even though it looks terrible in terms of design, I feel like I did make some improvements. (The website is not completely built yet, I still have some broken links to fix.)

Top comments (0)