{ }
NowArt Plicell
Online sales platform for Plicell, Zebra, and Stor curtains.
NowArt Plicell is a modern e-commerce platform built for one of Turkey's leading curtain retailers, offering Plicell, Zebra, Stor, and Wood Venetian Blind (Ahsap Jaluzi) product categories. Product detail pages feature multi-image galleries with zoom, color profile previews in seven swatches (Anthracite Grey, White, Grey, Brown, Cream, Shiny Bronze, Black), and size/variant selection. A measurement guide page and modal component help customers take accurate measurements before ordering. The multi-step checkout flows through address selection, cargo information, and an iyzico payment step. Due to iyzico SDK compatibility, the payment endpoint runs on the Pages Router. The email-based password reset flow stores a resetToken and resetTokenExpiry on the user model and delivers the reset link via Nodemailer. Institutional pages include bank account details, a downloadable PDF document, and a why-us section. Legal pages cover the distance sale agreement, KVKK, payment options, and personal data policy. The admin panel covers product, order, user, and blog management supported by Recharts analytics. A JSON-based seed system manages product, blog, and order data. Sharp handles server-side image processing. Built on Next.js 15 (Turbopack), TypeScript, Prisma ORM, and MySQL.
Technologies Used
teknolojiler.tsx
<div class="project-info">
<p>
This project was developed using the best tools modern web technologies offer. Each technology was carefully selected to maximize performance, security, and user experience. During development, the focus was on component-based architecture, reusable code, and optimized rendering performance.
</p>
<p>
The user interface was designed to provide a clean yet impactful visual experience. The design system is built on principles of consistency, readability, and accessibility. Modern CSS frameworks and utility tools were used to provide a strong styling foundation.
</p>
<p>
On the frontend, powerful technologies like React and Next.js provided great advantages in terms of fast load times and SEO optimization. Additionally, Tailwind CSS accelerated the design process and made development more flexible.
</p>
<p>
As a result, this technology stack forms a modern and sustainable infrastructure that supports not only today’s needs but also future scalability goals.
</p>
<p>
The project also delivers a seamless experience across all devices thanks to responsive design and a mobile-first approach. Every aspect of the design was optimized for usability and accessibility, ensuring smooth user interactions.
</p>
<p>
Performance optimizations were implemented to minimize page load times, including efficient media and image handling. This approach improves user experience while providing a solid foundation for SEO and overall site performance._
</p>
</div>
Next.js
Frontend
React
Frontend
TypeScript
Language
Prisma
Database
MySQL
Database
Tailwind CSS
Frontend
Vercel
DevOps
Problem
One of Turkey's established curtain retailers needed to move its catalog online with accurate measurement guidance while working around an iyzico SDK that didn't cleanly fit the App Router.
Solution
I built a Next.js 15 storefront with a measurement-guide modal and 7-swatch color profile previews, running the iyzico payment endpoint on the Pages Router specifically for SDK compatibility while the rest of the app stayed on the App Router.
Challenges
- Running a mixed Pages Router/App Router setup in the same Next.js app without breaking routing or shared layout/auth logic.
- Building a password-reset flow (resetToken/resetTokenExpiry) that expires correctly and can't be replayed.
Results
- Shipped a production storefront with server-side image processing (Sharp) and a JSON-based seed system for product/blog/order data.
- Admin analytics (Recharts) gave the retailer real-time visibility into sales they previously only tracked via manual bookkeeping.
Lessons Learned
When a third-party SDK has hard framework constraints, isolating it behind a narrow route boundary — rather than forcing the whole app to accommodate it — keeps the rest of the codebase on the preferred architecture.
Let's talk about the engineering behind this
If you'd like to discuss the architecture decisions, the tech stack, or a similar technical problem, I'm happy to talk.
Get in Touch