-
My website's previous iteration was built in 2021. It was bootstrapped using (the now deprecated) Create React App and it took approximately 2 months to build. The home page included a bunch of photos that I had taken myself of my desk and keyboard as background for several sections and it included most of the information on the website. In the middle of the page I put the SkillsTerminal (which also features in the current version), which provided visitors with a familiar and mobile-ready UI which included my tech skills, aswell as a bit of information on my work and project history.
-
Civic Auth
Auth in Less Than 5 Minutes. Civic Auth comes with multiple SSO options, optional embedded wallets, and user management — all implemented with just a few lines of code. Start building today.
-
shadcn/ui
A set of beautifully-designed, accessible components and a code distribution platform. Works with your favorite frameworks. Open Source. Open Code.
Revamping my website proved to be a rewarding journey filled with both challenges and learning experiences. Transitioning from JavaScript to TypeScript not only improved the robustness of my code but also enhanced the maintainability and scalability of the project. The move from styled-components to Tailwind CSS streamlined the styling process, resulting in cleaner code and better performance, while embracing the component-first approach with shadcn/ui brought more customization flexibility.
-
gray-matter
Smarter YAML front matter parser, used by metalsmith, Gatsby, Netlify, Assemble, mapbox-gl, phenomic, vuejs vitepress, TinaCMS, Shopify Polaris, Ant Design, Astro, hashicorp, garden, slidev, saber, sourcegraph, and many others. Simple to use, and battle tested. Parses YAML by default but can also parse JSON Front Matter, Coffee Front Matter, TOML Front Matter, and has support for custom parsers. Please follow gray-matter's author: https://github.com/jonschlinkert
Next is shifting towards what they're calling App Router. The previous itteration, known as Pages Router is not compatible with those shiny new React Server Components I mentioned earlier. The main difference to me was using simple fetch and async/await syntax to fetch the server side props. In this case, I had a node script that relied on fs to retrieve the markdown files and a library called gray-matter to retrieve their YAML metadata properties. Then all I had to do was transform my [slug] page into an async function and call the function that fetched the posts from the filesystem.
-
tamagui
Style React fast with 100% parity on React Native, an optional UI kit, and optimizing compiler.
So, along with the decision to use Typescript and start a codebase from scratch, I also decided that for once I was going to save some time and use one of those shiny new primitive libraries. I did not really want a complete set of UI components, but rather some primitives that worked out of the box but were also easily customizeable. In my last React Native project, I had worked with Tamagui and I loved it, I also really like the components provided in Hero UI (formerly known as Next UI), so I was going for something with the same visual style, but lighter.
-
One of the fads that I have never indulged in for the past few years was the Tailwind CSS fever. To me, this was just another Bootstrap waiting to be replaced by a more modern, more complete and lighter version of itself. And over the years, I've noticed that some component libraries would often indicate in their documentation that they recently migrated away from styled-components. Looking into it, I soon discovered that I would be facing the same decision.
-
CodeRabbit
CodeRabbit: AI Code Reviews for Developers. Revolutionize your code reviews with AI. CodeRabbit offers PR summaries, code walkthroughs, 1-click suggestions, and AST-based analysis. Boost productivity and code quality across all major languages with each PR.
