Here is my Blog and Portfolio / Personal Website.
Designed and Developed by JYC - Jared Yeung Creative
Welcome to my blog/personal website/portfolio, a project that I pursued for self-fulfillment.
After seeking advice from ChatGPT and Poe ( refer to this ), I incorporated their suggestions to enhance the skills utilized in this website.
I ventured into new territory while creating this website, pushing myself to explore fresh ideas and concepts.
BTW: This repo is for my learning purpose.
This is my first time to handle ReactJS / Nextjs / Sanity CMS / JSON / API, I will try my best to make it better for disclosing the source code, and the projects.
I'm too lazy, Vercel hosting and Sanity CMS save a lot of time.
I will add database later on my website.
Hosting: Vercel
Analytics: Vercel
Framework: ReactJS (NextJS)
CMS: Sanity CMS
CSS Styling: Tailwind CSS
Motion: Framer
Comment: Disqus
- HeadlessCMS: Leveraged the power of Sanity CMS, known for its high satisfaction score within the Jamstack Community.
- ReactJS (NextJS): Employed ReactJS to build a dynamic and responsive user interface.
- JavaScript (ReactJS): Effectively utilized useRef and useState hooks for optimized state management and interactivity.
- Tailwind CSS: Utilized Tailwind CSS to streamline the layout, enabling efficient styling for containers, columns, rows, and adapting to different media devices.
- Customized CSS: Employed custom CSS to elevate the design and bring to life the prototype inspired by the design mood board.
- Framer Motion: Implemented Framer Motion library to enhance the scrolling experience with smooth and engaging scroll triggers.
- Github: Leveraged Github for effective version control, enabling seamless collaboration and efficient management of codebase.
- NPM: Demonstrated proficiency in managing packages using NPM, ensuring the smooth integration of third-party libraries.
- Node: Developed JSON API routes and utilized .env files for secure and efficient data handling.
- Adobe: Utilized Adobe tools for design and photo retouching, ensuring visually appealing and polished aesthetics.
- Dark/ Light Mode
- Random Quote (Author description above)
- Loading effect
- Preloading
- Motion (Scroll trigger)
- Contact Me Form
- Sitemap
- 404 page link
- Post
- Archive list (categories, skills, industries, posts, works, experiments)
- Fetching Weather
- Fetching Spotify (My top tracks, Artists, curreny listening, latest albums in local market)
- Fetching The New York Times (Book list, Top Articles, Movie Reviews)
- Fetching RSS (Coursera, Open Culture, Codeacdemy, BBC)