Luna - Full Stack E commerce Store

Built using Next.js, Tailwind, Sanity CMS, Stripe API

Built using Next.js, Tailwind, Sanity CMS, Stripe API

Built using Next.js, Tailwind, Sanity CMS, Stripe API

Built using Next.js, Tailwind, Sanity CMS, Stripe API

Built using Next.js, Tailwind, Sanity CMS, Stripe API

Built on Next.js and styled with Tailwind CSS, this e-commerce website manages its content via a headless CMS (Sanity CMS) and utilizes the Stripe API for a secure and reliable checkout experience. Although the design of this project requires some rework, I primarily created it to practice crafting custom schemas with the Groq query language from Sanity CMS. I also gained more experience with Next.js through this project. It helped me familiarize myself with the framework.

Built on Next.js and styled with Tailwind CSS, this e-commerce website manages its content via a headless CMS (Sanity CMS) and utilizes the Stripe API for a secure and reliable checkout experience. Although the design of this project requires some rework, I primarily created it to practice crafting custom schemas with the Groq query language from Sanity CMS. I also gained more experience with Next.js through this project. It helped me familiarize myself with the framework.

Built on Next.js and styled with Tailwind CSS, this e-commerce website manages its content via a headless CMS (Sanity CMS) and utilizes the Stripe API for a secure and reliable checkout experience. Although the design of this project requires some rework, I primarily created it to practice crafting custom schemas with the Groq query language from Sanity CMS. I also gained more experience with Next.js through this project. It helped me familiarize myself with the framework.

Built on Next.js and styled with Tailwind CSS, this e-commerce website manages its content via a headless CMS (Sanity CMS) and utilizes the Stripe API for a secure and reliable checkout experience. Although the design of this project requires some rework, I primarily created it to practice crafting custom schemas with the Groq query language from Sanity CMS. I also gained more experience with Next.js through this project. It helped me familiarize myself with the framework.

Built on Next.js and styled with Tailwind CSS, this e-commerce website manages its content via a headless CMS (Sanity CMS) and utilizes the Stripe API for a secure and reliable checkout experience. Although the design of this project requires some rework, I primarily created it to practice crafting custom schemas with the Groq query language from Sanity CMS. I also gained more experience with Next.js through this project. It helped me familiarize myself with the framework.

Client

Personal Project

Services

Full Stack Project

Industries

E Commerce

Date

September 2022

✓ Utilizing the React Context API, this application employs advanced state management throughout. ✓ The use of Next.js offers file-based routing and data fetching capabilities that enable server-side rendering and static generation, leading to incredibly optimized websites. This is achieved through features such as getServerSideProps, getStaticPaths, and getStaticProps. ✓ Stripe is employed for managing payments, products, shipping rates, and the entire checkout process. ✓ With the help of Sanity CMS, developers can change the homepage and details of all products in the store instantly and on the go. This alleviates the need to worry about content, file storage, and databases, allowing for a focus on application development. The system takes care of the "dirty work" and enables the creation of scalable and modern e-commerce web applications with ease.

✓ Utilizing the React Context API, this application employs advanced state management throughout. ✓ The use of Next.js offers file-based routing and data fetching capabilities that enable server-side rendering and static generation, leading to incredibly optimized websites. This is achieved through features such as getServerSideProps, getStaticPaths, and getStaticProps. ✓ Stripe is employed for managing payments, products, shipping rates, and the entire checkout process. ✓ With the help of Sanity CMS, developers can change the homepage and details of all products in the store instantly and on the go. This alleviates the need to worry about content, file storage, and databases, allowing for a focus on application development. The system takes care of the "dirty work" and enables the creation of scalable and modern e-commerce web applications with ease.

✓ Utilizing the React Context API, this application employs advanced state management throughout. ✓ The use of Next.js offers file-based routing and data fetching capabilities that enable server-side rendering and static generation, leading to incredibly optimized websites. This is achieved through features such as getServerSideProps, getStaticPaths, and getStaticProps. ✓ Stripe is employed for managing payments, products, shipping rates, and the entire checkout process. ✓ With the help of Sanity CMS, developers can change the homepage and details of all products in the store instantly and on the go. This alleviates the need to worry about content, file storage, and databases, allowing for a focus on application development. The system takes care of the "dirty work" and enables the creation of scalable and modern e-commerce web applications with ease.

✓ Utilizing the React Context API, this application employs advanced state management throughout. ✓ The use of Next.js offers file-based routing and data fetching capabilities that enable server-side rendering and static generation, leading to incredibly optimized websites. This is achieved through features such as getServerSideProps, getStaticPaths, and getStaticProps. ✓ Stripe is employed for managing payments, products, shipping rates, and the entire checkout process. ✓ With the help of Sanity CMS, developers can change the homepage and details of all products in the store instantly and on the go. This alleviates the need to worry about content, file storage, and databases, allowing for a focus on application development. The system takes care of the "dirty work" and enables the creation of scalable and modern e-commerce web applications with ease.

✓ Utilizing the React Context API, this application employs advanced state management throughout. ✓ The use of Next.js offers file-based routing and data fetching capabilities that enable server-side rendering and static generation, leading to incredibly optimized websites. This is achieved through features such as getServerSideProps, getStaticPaths, and getStaticProps. ✓ Stripe is employed for managing payments, products, shipping rates, and the entire checkout process. ✓ With the help of Sanity CMS, developers can change the homepage and details of all products in the store instantly and on the go. This alleviates the need to worry about content, file storage, and databases, allowing for a focus on application development. The system takes care of the "dirty work" and enables the creation of scalable and modern e-commerce web applications with ease.

One of my favorite projects to date is this one, as it pushed me out of my comfort zone and into uncharted territory. At the time, headless CMS and query languages were still relatively new to me. However, this project aided in solidifying my understanding while also teaching me a few new tricks. I would like to apologize for the bright text colors in my work. I'm not sure what I was thinking at the time.🤷‍♂️

@2024 Natanael Pacheco

@2024 Natanael Pacheco