In the ever-evolving landscape of web development, exploring the latest technologies is not just a pursuit but a necessity. With Plantboard as a sideproject, a captivating WebApp crafted with NextJS, designed to push the boundaries of functionality offered by Next14 and hosted seamlessly on Vercel. This project is not merely a coding exercise; it's a foray into the world of digital horticulture, providing a platform for plant enthusiasts to cultivate and monitor their green companions with ease.

What Was Accomplished:

Plantboard is the result of leveraging NEXTJS, a React framework, and Vercel for seamless hosting. It is a straightforward yet powerful application that enables users to create virtual rooms or outdoor spaces, serving as a digital canvas to decorate with an assortment of digital plants. The user interface is intuitive, allowing for easy navigation and interaction.

One of the primary functionalities of Plantboard is basic plant care. Users can engage in activities like watering their digital plants, adding a tactile aspect to the experience. Beyond the visual appeal, the application provides practical insights into plant health metrics and humidity preferences. A concise summary of the entire plant collection is readily accessible, allowing users to stay informed about the well-being of their virtual green companions.

The integration of external APIs adds an additional layer of functionality to Plantboard. The Wishlist feature allows users to explore an extensive catalog of plants and mark those they wish to include in their virtual space. This seamless connection between internal and external data enriches the user experience, providing a holistic platform for plant enthusiasts to curate their ideal digital gardens.

Diving into the Technology:

The technological foundation of the project was constructed with a pragmatic approach, leveraging the capabilities of NextJS to seamlessly serve as both the frontend and backend. This strategic decision not only simplified the development process but also eliminated the need for incorporating an additional framework for backend management. The reliance on NextJS, coupled with the utilization of the Vercel ecosystem, offered a robust and cost-effective solution, especially with the convenience of its free tier. Deployment, a typically intricate phase, became remarkably straightforward within the Vercel ecosystem.

However, the ease of deployment comes with a trade-off – limited control over server optimization compared to traditional server software like nginx. This constraint, while notable, was balanced by the overall reliability and simplicity of the Vercel environment.

Authorization and user management were streamlined through AuthJS, a commendable framework renowned for its efficiency in handling users without the reliance on cookies or JWT. The integration of JWT or OAuth2.0, often a time-consuming process, was expedited thanks to this emerging npm package, simplifying the addition of OAuth and user management components.

Prisma, serving as the chosen ORM, provided a robust foundation for data modeling. While satisfied with its performance, the anticipation for experimenting with Drizzle in future projects is palpable. Drizzle, purportedly offering comparable functionality but potentially boasting superior performance, holds promise for enriching future database interactions.

The database itself was hosted on Vercel PostgresDB, a selection made notably for its seamless integration with Neon – a serverless PostgresDB hosting service. This choice was informed by a curiosity nurtured over the past few years, and the practical experience gained through the project underscored the simplicity and efficiency of the Neon-powered PostgresDB.

The integration of TypeScript emerged as a non-negotiable aspect of the development process. As the project unfolded, the journey of delving deeper into TypeScript unfolded in tandem, bringing a heightened fluidity to the development process. The satisfaction derived from the benefits of strongly typing the application fueled a newfound joy in working with TypeScript. The learning curve was steep, but the project served as a catalyst for a substantial increase in TypeScript proficiency, supplemented by insightful guidance from YouTuber Matt Pocock.

In conclusion, the technological choices made in this project were strategic, aiming to strike a balance between ease of development, performance, and future scalability. The amalgamation of NextJS, Vercel ecosystem, AuthJS, Prisma, TypeScript, and Neon-powered PostgresDB resulted in a cohesive and efficient tech stack that not only fulfilled the project requirements but also contributed to an enriching learning experience. The journey of technological exploration continues, with each project offering new insights and opportunities for growth.

Future Plans:

The overall main goal is to design a hardware device that communicates automatically with Plantboard. At the heart of this technological marvel is an Arduino microcontroller, which acts as the brain of the system. The device is equipped with 3D printed pumps, a common plastic bottle serving as the water reservoir, and a set of sensors to measure crucial environmental parameters. The integration of these components allows for the creation of a compact, cost-effective, and user-friendly system that seamlessly connects to the Plantboard platform.

Sophisticated Sensing Capabilities:

The Arduino device employs advanced sensors to continuously monitor the environment surrounding the plant. This includes real-time measurements of humidity levels, ensuring that users receive accurate and timely updates on the atmospheric conditions affecting their green companions. The precision of these measurements enhances the user's ability to tailor their care routines to the specific needs of each plant.

Automated Watering System:

One of the standout features of this Arduino-powered device is its automated watering system. By utilizing the 3D printed pumps and a plastic bottle reservoir, the device can intelligently dispense water to the plant based on the real-time humidity readings. This ensures that plants receive optimal hydration without the risk of overwatering, promoting healthier growth and reducing the potential for user error.

Integration with Plantboard:

The true brilliance of this system lies in its seamless integration with the Plantboard platform. The Arduino device is designed to automatically send updates, including humidity levels and watering activities, directly to the user's Plantboard account. This integration not only enhances the user's ability to monitor their plants but also creates a holistic ecosystem where technology and plant care converge effortlessly.

Looking forward, the potential for this Arduino-powered device is immense. As Plantboard continues to evolve, future updates may further enhance the integration and compatibility of such smart devices. This may include additional features, such as customized care recommendations based on the data collected by the Arduino device, creating a more personalized and intelligent approach to plant care.In conclusion, the marriage of Arduino technology, 3D printing, and common household items has given rise to an innovative solution that elevates plant care to new heights. This automated system not only simplifies the monitoring and watering process but also seamlessly integrates with the Plantboard platform, aligning with the broader vision of creating a connected community of plant enthusiasts. As technology continues to advance, the future of plant care looks promising, with intelligent devices like these paving the way for a more efficient and enjoyable gardening experience.

~ julianjauk 2024