The latest articles on DEV Community by kimani karaba🇰🇪 (@kimanigeoffre14). https://dev.to/kimanigeoffre14 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%2F649138%2F18f7408e-a7b3-493f-8e28-e8b9b4c3bf4d.jpg https://dev.to/kimanigeoffre14 en kimani karaba🇰🇪 Sat, 22 Mar 2025 08:17:10 +0000 https://dev.to/kimanigeoffre14/iviatu-e-commerce-app-with-ai-shopping-assistant-551p https://dev.to/kimanigeoffre14/iviatu-e-commerce-app-with-ai-shopping-assistant-551p <p><em>This is a submission for the <a href="https://dev.to/challenges/kendoreact">KendoReact Free Components Challenge</a>.</em></p> <h2> What I Built </h2> <p>We built an AI-powered e-commerce platform that enhances the shopping experience through AI. The platform integrates an AI shopping assistant to provide personalized product recommendations and streamline the shopping process. It leverages KendoReact's rich UI components to create a visually appealing and highly responsive interface</p> <h3> Demo </h3> <p>Live Demo: <a href="https://iviatu.vercel.app/" rel="noopener noreferrer">https://iviatu.vercel.app/</a></p> <p>Github Repo: <a href="https://github.com/Enolley/kendoui" rel="noopener noreferrer">https://github.com/Enolley/kendoui</a></p> <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%2F9xtt8uwa0s9onyyg0zy5.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%2F9xtt8uwa0s9onyyg0zy5.png" alt="Home Page" width="800" height="450"></a></p> <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%2Fp65126alyubqm425q0v5.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%2Fp65126alyubqm425q0v5.png" alt="AI Shopping Assistance" width="800" height="465"></a></p> <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%2Fhp1acgubp4otctm727l0.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%2Fhp1acgubp4otctm727l0.png" alt="AI Helper" width="800" height="450"></a></p> <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%2F32f3pnjfr67fdzsd8eoo.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%2F32f3pnjfr67fdzsd8eoo.png" alt="About Page" width="800" height="401"></a></p> <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%2Fdlngehxzy7jfnu1c0of0.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%2Fdlngehxzy7jfnu1c0of0.png" alt="Product Detail" width="800" height="450"></a></p> <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%2Fswiptkianma6wu2xblo4.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%2Fswiptkianma6wu2xblo4.png" alt="Shopping cart" width="800" height="450"></a></p> <h2> KendoReact Experience </h2> <p>KendoReact played a crucial role in the development of this project by providing high-quality UI components that enabled a smooth and professional user experience. The following KendoReact components were used:</p> <ul> <li>Input</li> <li>Button</li> <li>Popup</li> <li>Notification</li> <li>AppBar</li> <li>PageLoader</li> <li>Indicators</li> <li>Animate</li> <li>SvgIcons</li> <li>Card</li> <li>Skeleton</li> </ul> <p>The ease of use and customization offered by KendoReact significantly accelerated the development process while maintaining high design standards.</p> <h3> AIm to Impress </h3> <p>The AI shopping assistant is powered by OpenAI’s GPT model, enabling users to interact with a chatbot that provides shopping guidance, product recommendations, and customer support. The integration enhances user engagement by making the shopping experience interactive and efficient. The AI assistant can:</p> <ul> <li><p>Understand user preferences and suggest products accordingly.</p></li> <li><p>Answer product-related queries.</p></li> <li><p>Assist with checkout and order tracking.</p></li> </ul> <h3> Delightfully Designed </h3> <p>Other Team Members</p> <ol> <li><p>muganda</p></li> <li><p>nolley</p></li> </ol> devchallenge kendoreactchallenge react webdev kimani karaba🇰🇪 Tue, 28 Sep 2021 07:56:42 +0000 https://dev.to/kimanigeoffre14/more-on-javascript-functions-3mcd https://dev.to/kimanigeoffre14/more-on-javascript-functions-3mcd <p>Functions are essential part of our daily code an everybody uses them at one point in time. <br> Here is a basic skeleton of a javascript function: </p> <p>function functionName(){<br> //code goes here;<br> }<br> let us explore a little more sophisticated concepts on functions.</p> <p>1.Immediately invoked function expressions (IIFE)<br> These means invoking a function immediately after it has been defined.<br> for example instead of writting:</p> <p>function helloWorld(){<br> console.log('hello world');<br> }</p> <p>helloWorld(); //invoking it manually</p> <p>we can use the IIFE to do it immediately after defining it.</p> <p>(function() {<br> console.log("hello world");<br> )();}</p> <ol> <li>Arrow functions Was introduced in ES6.It is a simpler way to write function expression. (note: it is not a substitute to writing functions)</li> </ol> <p>example: <br> //function to return sum of two numbers<br> let sum = (num1 , num2) =&gt; num1 + num2;</p> <p>console.log(sum(2,6)); //8</p> <p>why use arrow functions?</p> <ol> <li>shorter syntax.</li> <li>simpler way to write function expression.</li> <li>this derives its value from enclosing lexical scope.</li> </ol> <p>side effects</p> <ol> <li>you have to be ware of the behavior of 'this' keyword.</li> <li>no argument object.</li> </ol> <h1> Thanks for making time </h1> <p>Twitter: <a class="mentioned-user" href="https://dev.to/kimanigeoffre14">@kimanigeoffre14</a> </p>