Open to opportunities and provide value to you company - the usual dev from bengaluru

Dhanush D  • Peerlist

DoodleBoard is an intuitive and easy-to-use web application designed for collaborative brainstorming, sketching, and idea-sharing. Whether you're working solo or collaborating with a team, DoodleBoard provides a simple platform to visualize and share ideas in real time.<h3>Key Features:</h3><ul><li>Real-time Collaboration: Create a shared room and invite others to collaborate in real time. As you draw or make changes, others see the updates immediately, thanks to WebSockets.</li><li>Drawing Tools: Use basic shapes like rectangles, circles, lines, and text to illustrate ideas. All shapes can be drawn freely on the canvas.</li><li>Custom Rooms: Create unique rooms and share the room slug for others to join. Each room has a dedicated space for brainstorming.</li><li>Authentication: Secure login and signup features with protected routes ensure that only authorized users can access certain rooms or features.</li><li>Minimalist UI: The design, built using shadcn, offers a clean and attractive interface for a seamless user experience.</li></ul><h3>Technology Stack:</h3><ul><li>Frontend: Built with Next.js for fast rendering and a responsive user interface.</li><li>Backend: Developed with Node.js and Express for handling server requests, user authentication, and room management.</li><li>Real-time Features: Powered by WebSockets to enable live sharing of shapes and updates between users.</li><li>UI Design: Crafted with shadcn for a minimalist and modern aesthetic, making the user experience smooth and enjoyable.</li><li>Canvas: The app uses a raw HTML canvas to render shapes and text, giving users full control over their drawings and sketches.</li></ul><h3>How It Works:</h3><ol><li>Sign Up/Log In: Users can authenticate via a secure login/signup system. After logging in, they can access protected rooms.</li><li>Create a Room: Users can create a new room with a unique slug (link), which they can share with others to join.</li><li>Collaborate: Users can draw and share ideas using shapes and text on the canvas. All changes are visible in real-time.</li><li>Join a Room: Simply share the room slug with others, and they can instantly join your collaborative space.</li></ol>

DoodleBoard

<ul><li>Framer-based Resume Template – Designed with smooth animations and transitions for an interactive experience.</li><li>Built with Next.js, Tailwind CSS, Framer Motion, and TypeScript – Ensures responsiveness, performance, and type safety.</li><li>Structured Development Process – Organized into sections like navbar, hero, resume, and footer, with subcomponents built first.</li><li>Custom Theme and Styles – Configured Tailwind CSS with a custom theme, base styles, and utility classes for consistency.</li><li>Deployed on Vercel with a Custom Domain – Ensures fast performance and accessibility.</li></ul>

Civio

In this project, I aimed to create a responsive web application within a single day. To achieve this, I utilized Next.js for its efficient server-side rendering capabilities, Tailwind CSS for rapid and consistent styling, and Framer Motion to incorporate smooth animations that enhance user interactivity.Project Goals:<ul><li>Responsive Design: Ensure seamless functionality across mobile, tablet, and desktop devices.</li><li>Dynamic Animations: Integrate engaging animations to enhance user experience.</li><li>Rapid Development: Complete the project within a tight timeframe to demonstrate efficiency.</li></ul>Development Process:<ol><li>Resource Gathering: I began by sourcing a free template from the Framer community and collecting necessary assets from YouTube.</li><li>Design Analysis: Utilized Figma to dissect the design structure, facilitating a clear understanding of each component.</li><li>Implementation: Adopted a mobile-first approach, coding each section sequentially and incorporating animations using Framer Motion.</li><li>Styling: Employed Tailwind CSS for efficient and consistent styling across the application.</li><li>Deployment: Deployed the application on Vercel, ensuring streamlined hosting and scalability.</li></ol>Key Features:<ul><li>Responsive Layout: Optimized for mobile, tablet, and desktop viewing.</li><li>Smooth Animations: Enhanced interactivity through Framer Motion.</li><li>Efficient Styling: Consistent design achieved with Tailwind CSS.</li><li>Rapid Deployment: Hosted on Vercel for optimal performance.</li></ul>This project not only demonstrates my ability to deliver high-quality work under tight deadlines but also reflects my proficiency in modern web development tools.