The latest articles on DEV Community by Sujal Krsoni (@sujalsoni). https://dev.to/sujalsoni https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3824958%2F00cef695-219d-4deb-abfa-bc06c51655bb.png https://dev.to/sujalsoni en Sujal Krsoni Thu, 28 May 2026 18:47:07 +0000 https://dev.to/sujalsoni/-sujal-soni-biography-full-story-career-education-developer-journey-2dbo https://dev.to/sujalsoni/-sujal-soni-biography-full-story-career-education-developer-journey-2dbo <h2> Who is Sujal Soni? </h2> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fa323m8izf9degxm6pf0a.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fa323m8izf9degxm6pf0a.png" alt=" " width="800" height="800"></a></p> <p>Sujal Soni, whose full name is <strong>Sujal Kumar Soni</strong>, is an Indian Full Stack Developer, Software Engineer, and digital creator known for building modern web applications, scalable backend systems, and premium user experiences using technologies like Next.js, React.js, Node.js, MongoDB, and TypeScript.</p> <p>Born on <strong>11 December 2003</strong> in Delhi, India, Sujal developed an interest in technology, the internet, and digital platforms from a very young age. Over time, his passion evolved into web development, software engineering, personal branding, content creation, and entrepreneurship.</p> <p>Today, he focuses on building scalable digital products, improving his technical expertise, and growing his personal brand as a software engineer.</p> <h1> Personal Information </h1> <h3> Full Name </h3> <p>Sujal Kumar Soni</p> <h3> Known As </h3> <p>Sujal Soni</p> <h3> Date of Birth </h3> <p>11 December 2003</p> <h3> Birthplace </h3> <p>Delhi, India</p> <h3> Hometown </h3> <p>Bagodar, Jharkhand, India</p> <h1> Family Background </h1> <p>Sujal belongs to a supportive and hardworking family.</p> <h3> Father </h3> <p>Santosh Kumar</p> <h3> Mother </h3> <p>Sangeeta Devi</p> <h3> Sister </h3> <p>Shweta Kumari</p> <h3> Brother </h3> <p>Sanjeev Kumar</p> <p>His younger brother, Sanjeev Kumar, is also known in the digital space as:</p> <ul> <li>a YouTuber</li> <li>digital marketer</li> <li>fitness enthusiast</li> <li>bodybuilder</li> </ul> <p>His YouTube channel has gained lakhs of subscribers over time.</p> <h1> Education </h1> <h2> Schooling </h2> <p>Sujal completed his schooling in Delhi from:</p> <h3> Govt Boys Senior Secondary School, Jahangir Puri K Block </h3> <p>During his school years, he developed a strong interest in computers, technology, creativity, and online platforms.</p> <h2> College </h2> <p>After completing school, Sujal pursued:</p> <h3> Bachelor of Computer Applications (BCA) </h3> <p>from:</p> <h3> IGNOU (Indira Gandhi National Open University) </h3> <p>During his college journey, he focused heavily on self-learning and practical development skills alongside academics.</p> <h1> Learning Web Development </h1> <p>Sujal learned web development primarily through:</p> <ul> <li>online courses</li> <li>YouTube tutorials</li> <li>practical project building</li> <li>continuous self-learning</li> </ul> <p>He completed and learned from multiple platforms and educators including:</p> <ul> <li>Apna College</li> <li>Infosys courses</li> <li>Procodrr</li> <li>Chai aur Code (Chaicode)</li> <li>various web development communities and creators</li> </ul> <p>Over time, he built strong skills in:</p> <ul> <li>frontend development</li> <li>backend development</li> <li>full stack application architecture</li> <li>responsive design</li> <li>APIs</li> <li>authentication systems</li> <li>SEO optimization</li> <li>animations and UI/UX</li> </ul> <h1> Early Teaching Journey </h1> <p>Interestingly, Sujal started teaching from his school days.</p> <p>From around 11th class, he began teaching small children and helping students with studies. This helped him improve:</p> <ul> <li>communication skills</li> <li>confidence</li> <li>leadership</li> <li>patience</li> </ul> <p>Teaching also helped him understand how to explain complex topics in simple ways.</p> <h1> YouTube Journey </h1> <p>Apart from development, Sujal was also active in content creation and YouTube from a young age.</p> <h2> First YouTube Success </h2> <p>Around 2019, he managed to grow a YouTube channel to:</p> <h3> over 100,000 subscribers </h3> <p>However, due to copyright-related issues, the channel was eventually terminated.</p> <p>Despite this setback, he continued exploring content creation and started working on other YouTube channels with different niches.</p> <h2> Gaming Channel Journey </h2> <p>Later, Sujal started another gaming-focused YouTube channel. However, due to studies and career priorities, he eventually stopped focusing on it.</p> <p>His younger brother later continued in the content creation space and successfully grew a channel to over 100k subscribers.</p> <p>This entire journey helped Sujal gain experience in:</p> <ul> <li>content creation</li> <li>branding</li> <li>audience building</li> <li>social media</li> <li>digital platforms</li> </ul> <h1> Career &amp; Professional Journey </h1> <h2> Internship at CloudTrains Global </h2> <p>Sujal started his professional journey with an internship at:</p> <h3> CloudTrains Global </h3> <p>During this internship, he gained real-world exposure to:</p> <ul> <li>frontend development</li> <li>backend development</li> <li>APIs</li> <li>team collaboration</li> <li>professional workflows</li> <li>scalable application development</li> </ul> <p>This experience helped him transition from learning to real industry development.</p> <h1> Backend Developer at eVanik </h1> <p>After the internship, Sujal worked with:</p> <h3> eVanik </h3> <p>as a:</p> <h3> Backend Developer </h3> <p>Here, he worked on backend systems, APIs, authentication, databases, and server-side application logic.</p> <p>This role helped him improve:</p> <ul> <li>Node.js development</li> <li>database handling</li> <li>API architecture</li> <li>backend scalability</li> </ul> <h1> Working With WayOne IT Solutions (Dubai) </h1> <p>Sujal also worked with:</p> <h3> WayOne IT Solutions (Dubai) </h3> <p>where he contributed to development-related projects and gained further exposure to professional software engineering environments.</p> <h1> Freelancing Journey </h1> <p>After gaining experience from internships and company work, Sujal started focusing on:</p> <h3> freelancing and independent development work </h3> <p>He began working with:</p> <ul> <li>multiple companies</li> <li>startups</li> <li>clients</li> <li>digital businesses</li> </ul> <p>His freelancing work includes:</p> <ul> <li>frontend development</li> <li>backend systems</li> <li>MERN stack applications</li> <li>responsive UI development</li> <li>API integration</li> <li>portfolio websites</li> <li>scalable web applications</li> </ul> <h1> Technical Skills </h1> <h2> Frontend </h2> <ul> <li>React.js</li> <li>Next.js</li> <li>JavaScript</li> <li>TypeScript</li> <li>Tailwind CSS</li> <li>GSAP</li> </ul> <h2> Backend </h2> <ul> <li>Node.js</li> <li>Express.js</li> <li>MongoDB</li> <li>REST APIs</li> <li>Authentication Systems</li> </ul> <h2> Other Skills </h2> <ul> <li>SEO Optimization</li> <li>Responsive Design</li> <li>Git &amp; GitHub</li> <li>Performance Optimization</li> <li>UI/UX Improvements</li> </ul> <h1> Vision &amp; Goals </h1> <p>Sujal aims to:</p> <ul> <li>become a top-level software engineer</li> <li>build scalable digital products</li> <li>create impactful startup-level applications</li> <li>grow his personal brand globally</li> <li>work with international clients</li> <li>continuously improve his technical and business skills</li> </ul> <p>He strongly believes in:</p> <ul> <li>consistency</li> <li>self-learning</li> <li>practical development</li> <li>creativity</li> <li>continuous improvement</li> </ul> <h1> Online Presence </h1> <h3> Portfolio </h3> <p><a href="https://sujalsoni.in" rel="noopener noreferrer">https://sujalsoni.in</a></p> <h3> LinkedIn </h3> <p><a href="https://linkedin.com/in/sujalsoni" rel="noopener noreferrer">https://linkedin.com/in/sujalsoni</a></p> <h3> GitHub </h3> <p><a href="https://github.com/sujalkrsoni" rel="noopener noreferrer">https://github.com/sujalkrsoni</a></p> <h1> Final Thoughts </h1> <p>Sujal Soni’s journey reflects consistency, curiosity, learning, and growth.</p> <p>From teaching students during school days to building web applications, working with companies, exploring YouTube, freelancing, and growing as a software engineer — his journey continues to evolve with technology, creativity, and ambition.</p> <p>He continues learning, building, and improving every day while working toward becoming a globally recognized software engineer and entrepreneur.</p> Sujal Krsoni Thu, 28 May 2026 18:29:07 +0000 https://dev.to/sujalsoni/-how-i-built-my-personal-developer-portfolio-using-nextjs-tailwind-css-advanced-seo-3p03 https://dev.to/sujalsoni/-how-i-built-my-personal-developer-portfolio-using-nextjs-tailwind-css-advanced-seo-3p03 <p>As a developer, I always wanted a portfolio that did more than just look good.</p> <p>I wanted a platform that could:</p> <ul> <li>showcase my projects professionally</li> <li>strengthen my personal brand</li> <li>improve my visibility on Google</li> <li>connect all my social profiles</li> <li>demonstrate my frontend development skills</li> <li>create a strong online presence</li> </ul> <p>So I decided to build my own developer portfolio using <strong>Next.js, Tailwind CSS, TypeScript, and modern SEO practices</strong>.</p> <p>My primary focus was on:</p> <ul> <li>performance</li> <li>SEO optimization</li> <li>smooth animations</li> <li>responsive design</li> <li>accessibility</li> <li>scalability</li> <li>personal branding</li> <li>discoverability</li> </ul> <p>The goal was simple:</p> <blockquote> <p>When someone searches my name online, they should instantly find my portfolio, projects, and professional profiles in a clean and professional way.</p> </blockquote> <h1> Tech Stack I Used </h1> <p>Here’s the complete stack behind my portfolio:</p> <ul> <li>Next.js (App Router)</li> <li>React.js</li> <li>Tailwind CSS</li> <li>TypeScript</li> <li>GSAP</li> <li>Framer Motion</li> <li>Vercel</li> <li>Google Search Console</li> <li>Google Analytics</li> <li>JSON-LD Structured Data</li> <li>Open Graph SEO</li> <li>Responsive UI Design</li> </ul> <h1> Why I Chose Next.js </h1> <p>I chose Next.js because it provides everything needed for building a modern, SEO-friendly web application.</p> <p>Some major advantages include:</p> <ul> <li>excellent SEO support</li> <li>server-side rendering (SSR)</li> <li>static site generation (SSG)</li> <li>optimized metadata handling</li> <li>fast performance</li> <li>image optimization</li> <li>clean routing system</li> <li>scalable architecture</li> <li>amazing developer experience</li> </ul> <p>Since ranking on Google was one of my main goals, Next.js felt like the perfect framework for this project.</p> <h1> Designing the User Interface </h1> <p>I wanted the portfolio to feel:</p> <ul> <li>modern</li> <li>premium</li> <li>interactive</li> <li>smooth</li> <li>minimal</li> <li>professional</li> </ul> <p>To achieve this, I focused heavily on:</p> <ul> <li>clean typography</li> <li>balanced spacing</li> <li>responsive layouts</li> <li>dark modern aesthetics</li> <li>mobile-first design</li> <li>smooth transitions</li> <li>interactive animations</li> </ul> <p>I used <strong>GSAP</strong> and <strong>Framer Motion</strong> to create engaging animations while maintaining smooth performance across devices.</p> <p>The goal was to create a portfolio that feels polished and enjoyable to explore.</p> <h1> SEO Optimization Strategy </h1> <p>SEO was one of the most important parts of this project.</p> <p>I wanted my portfolio to be properly indexed by search engines and appear professionally in search results.</p> <p>So I implemented:</p> <ul> <li>dynamic metadata</li> <li>sitemap.xml</li> <li>robots.txt</li> <li>canonical URLs</li> <li>Open Graph tags</li> <li>Twitter/X meta tags</li> <li>semantic HTML</li> <li>structured data (JSON-LD)</li> <li>optimized images</li> <li>lazy loading</li> <li>fast-loading pages</li> <li>accessibility improvements</li> </ul> <p>I also integrated the website with:</p> <ul> <li>Google Search Console</li> <li>Google Analytics</li> <li>Bing Webmaster Tools</li> </ul> <p>These tools helped me:</p> <ul> <li>monitor indexing</li> <li>analyze traffic</li> <li>improve discoverability</li> <li>track performance</li> <li>optimize SEO health</li> </ul> <h1> Building Personal Branding Through Social Profiles </h1> <p>One of my biggest goals was improving my personal branding online.</p> <p>To strengthen my digital identity, I connected multiple developer and social platforms directly to my portfolio.</p> <p>These include:</p> <ul> <li>GitHub</li> <li>LinkedIn</li> <li>Twitter/X</li> <li>Instagram</li> <li>Dev.to</li> <li>Medium</li> <li>YouTube</li> <li>LeetCode</li> <li>CodePen</li> <li>Behance</li> <li>Dribbble</li> <li>Hashnode</li> </ul> <p>Adding these profiles helps search engines understand my online identity and improves authority across platforms.</p> <h1> My Portfolio &amp; Social Links </h1> <ul> <li>Portfolio: <a href="https://sujalsoni.in" rel="noopener noreferrer">https://sujalsoni.in</a> </li> <li>GitHub: <a href="https://github.com/sujalkrsoni" rel="noopener noreferrer">https://github.com/sujalkrsoni</a> </li> <li>LinkedIn: <a href="https://linkedin.com/in/sujalsoni" rel="noopener noreferrer">https://linkedin.com/in/sujalsoni</a> </li> <li>Twitter/X: <a href="https://x.com/sujalkrsoni" rel="noopener noreferrer">https://x.com/sujalkrsoni</a> </li> <li>Dev.to: <a href="https://dev.to/sujalsoni">https://dev.to/sujalsoni</a> </li> <li>Medium: <a href="https://medium.com/@sujalkrsoni" rel="noopener noreferrer">https://medium.com/@sujalkrsoni</a> </li> <li>Instagram: <a href="https://instagram.com/itz_sujalsoni__" rel="noopener noreferrer">https://instagram.com/itz_sujalsoni__</a> </li> <li>YouTube: <a href="https://www.youtube.com/@MRCODER_YT" rel="noopener noreferrer">https://www.youtube.com/@MRCODER_YT</a> </li> </ul> <h1> How I Improved SEO Using Social Links </h1> <p>I didn’t just place social links randomly.</p> <p>I strategically added them inside:</p> <ul> <li>footer sections</li> <li>metadata</li> <li>structured data (JSON-LD)</li> <li>Open Graph profiles</li> <li>author schema</li> <li>social preview tags</li> </ul> <p>This helps Google connect all profiles together and improves:</p> <ul> <li>SEO signals</li> <li>entity recognition</li> <li>online authority</li> <li>personal branding</li> <li>discoverability</li> </ul> <p>Consistency across platforms is extremely important for building a strong digital identity.</p> <h1> Challenges I Faced During Development </h1> <p>Building this portfolio wasn’t easy.</p> <p>Some major challenges included:</p> <ul> <li>responsive layout optimization</li> <li>animation performance tuning</li> <li>SEO configuration in Next.js</li> <li>metadata management</li> <li>structured data implementation</li> <li>domain setup and indexing</li> <li>social profile integration</li> <li>performance optimization</li> </ul> <p>Solving these problems gave me a much deeper understanding of real-world frontend development.</p> <h1> What I Learned From This Project </h1> <p>This project taught me a lot about modern web development and personal branding.</p> <p>Some key lessons include:</p> <ul> <li>how modern portfolios should be structured</li> <li>how SEO works for developers</li> <li>importance of performance optimization</li> <li>how branding impacts visibility</li> <li>how social media improves discoverability</li> <li>how to build scalable frontend architecture</li> <li>how metadata and structured data work</li> <li>how Google indexing actually functions</li> </ul> <p>More importantly, I learned that a portfolio is not just a website — it’s your digital identity.</p> <h1> Final Thoughts </h1> <p>Building a developer portfolio is much more than creating a beautiful UI.</p> <p>It represents:</p> <ul> <li>your skills</li> <li>your creativity</li> <li>your personality</li> <li>your growth</li> <li>your professional identity</li> <li>your online presence</li> </ul> <p>I’m continuously improving my portfolio, experimenting with new technologies, and learning more about SEO and frontend engineering every day.</p> <p>If you're a developer, I highly recommend building your own portfolio from scratch.</p> <p>It teaches you:</p> <ul> <li>real-world development</li> <li>performance optimization</li> <li>responsive design</li> <li>SEO fundamentals</li> <li>deployment workflows</li> <li>branding strategies</li> </ul> <p>Much more than tutorials ever can.</p> <p>Also, make sure to properly connect all your social profiles and portfolio links because it helps improve:</p> <ul> <li>SEO</li> <li>Google indexing</li> <li>online authority</li> <li>networking opportunities</li> <li>personal branding</li> <li>discoverability</li> </ul> <p>Thanks for reading 🚀</p> <p>— Sujal Soni</p> nextjs showdev tailwindcss webdev