My new portfolio developed with React and TypeScript, in addition to using some libraries to improve the application.
Important Folders:
- public: This folder contains almost all the files used by the application, and is consumed by useFetch.tsx.
- src:
- assets: Files also used in the application.
- components: All the components are here.
- constants: Constant variables to avoid hard coding.
- context: Contexts are here, including useFetch which provides data to the other components that need it.
- enum: Enums.
- helpers: Most of the logic is here.
- hook: The only custom hook, useFetch.tsx.
- interface: Interfaces to be more explicit.
- styles: All the styles used, mostly or almost all of them are .ts files.
I think this was the project that took me the longest, I used a lot of libraries and learned a lot of things. I reuse some components that I already had from other projects which helped me a lot in the development process (customHook, DataContext), This project helped me a lot when creating interfaces, creating helpers, on the other hand what was a bit confusing for me was the project structure since at first I thought it would not be a lot of work, and I would develop it in a simple way, but after a lot of development, I didn't know what project structure to handle, but I think looks good. By the way, in the development of this project I learned a little more about the configuration of TypeScript, ESLint, and Prettier, to handle the code in a slightly cleaner way.
- React + Typescript
- styled-components
- localforage
- react-syntax-highlighter
- react-tooltip
- react-use-scrollspy
- Vite
💻 You can copy the link and paste it in your browser: https://portfolio-harvey.netlify.app/
🔗 I was also able to open the website by clicking here.
-
Harvey Yerik