The latest articles on DEV Community by md alif (@red_mad_zone). https://dev.to/red_mad_zone https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F4102180%2F00786b8a-7f98-4d07-9e16-80ab615bee8c.png https://dev.to/red_mad_zone en md alif Mon, 31 Aug 2026 06:02:42 +0000 https://dev.to/red_mad_zone/building-my-first-web-app-a-feature-packed-offline-pwa-calculator-4djk https://dev.to/red_mad_zone/building-my-first-web-app-a-feature-packed-offline-pwa-calculator-4djk <p>Hi everyone! 👋</p> <p>I just published <strong>v1.0.0</strong> of my very first web project: an installable <strong>Progressive Web App (PWA)</strong> built from scratch using HTML, CSS, and Vanilla JavaScript. </p> <p>I designed it to be extra accessible and versatile, especially for older adults, shopkeepers, students, and everyday users.</p> <h3> ✨ Key Features </h3> <ul> <li> <strong>Multiple Modes:</strong> Standard, Scientific, Sales, Interest (Simple &amp; Compound), Unit Conversions, BMI, Age, and Adjustable Percentage.</li> <li> <strong>Customization:</strong> Adjustable button sizes and custom background themes (including Dark and Light modes).</li> <li> <strong>Offline PWA Support:</strong> Service worker caching allows full offline functionality and direct installation on mobile or desktop devices.</li> </ul> <h3> 🔗 Try It Out &amp; Explore Code </h3> <ul> <li>🚀 <strong>Live Demo:</strong> <a href="https://mdalif027-tech.github.io/easy-calculator/" rel="noopener noreferrer">mdalif027-tech.github.io/easy-calculator</a> </li> <li>💻 <strong>GitHub Repository:</strong> <a href="https://github.com/mdalif027-tech/easy-calculator" rel="noopener noreferrer">github.com/mdalif027-tech/easy-calculator</a> </li> </ul> <h3> 💬 Looking for Feedback </h3> <p>Since this is my first app, I would really appreciate any thoughts on:</p> <ol> <li>Mobile touch layout and responsiveness across screen sizes.</li> <li>UI/UX design or theme improvements.</li> <li>Recommendations for features to add in future releases.</li> </ol> <p>Thank you so much for checking it out!</p> beginners javascript showdev webdev