DAILY NEWS

Stay Ahead, Stay Informed – Every Day

Advertisement
Re-Engineering My Portfolio: Moving from No-Code to React & Firebase



GitHub “Finish-Up-A-Thon” Challenge Submission

This is a submission for the GitHub Finish-Up-A-Thon Challenge

What I Built

I built a professional, production-ready React 18 + Vite Engineering Portfolio and Interactive Media Dashboard. As an undergraduate studying Electronic and Telecommunication Engineering, my work constantly jumps between hardware schematic designs, firmware code, web dashboards, and technical writing.

This platform isn’t just a basic resume resume layout; it’s a fully integrated software architecture. It bridges a modern dark UI framework with a robust Firebase 11 ecosystem. The system handles live data mirroring via Firestore, real-time social engagement pipelines (likes, threaded blog comments), dynamic newsletter enrollment tracking, and automated static Open Graph template injections so social platforms scrape perfect image previews whenever my work is shared.

Demo

🌐 Live Production ApplicationExplore the live deployment here: (https://kaushalyamullegama.netlify.app)

1. The Home Page & Background Canvas View

2. The Interactive Skills Bento Grid View

uploads.s3.amazonaws.com/uploads/articles/cqdtrn4w2imknigu2n96.png)

3. The Live CMS Admin Edit View

The Comeback Story

The Problem:The portfolio originally lived as a closed-source, layout-restricted mock-up draft on Wix Studio (Previous Wix Draft- (https://krbmullegama.wixstudio.com/kaushalya)). While it visually captured my style, it lacked real engineering depth. It was completely static, did not allow for any user interaction, could not dynamically display project logs or updates without opening a visual website builder, and lacked proper modern developer ergonomics.

Rebuilding from ScratchI decided to revive this static layout draft and transition it into a maintainable engineering asset. I used an advanced AI workflow to turn this project around. First, I utilized Gemini to scrape the visual assets, text structures, and image links from the original page layout, translating them into a clean Single-Page Application baseline. From there, I expanded the architecture into a full-scale React + Vite software app using GitHub Copilot.

What I changed, fixed, and added to finish it up:

The Cloud Data Layer: Centralized static data configurations in src/data/defaultContent.js with structured, automated fallbacks to local files if Firestore network connections are unavailable.

Real-time Interaction Hub: Added dynamic user spaces utilizing real-time Firestore synchronization tunnels for a live blog commenting system and client post likes.

Pre-rendered Social Previews: Integrated custom shell preprocessing commands inside package.json (npm run build runs a secondary custom script scripts/generate-shares.js) that outputs pre-rendered meta configurations inside an export wrapper. This provides beautiful social card embeds on messaging apps like WhatsApp, Discord, or X.

Responsive Layout Overhaul: Rebuilt the layout sheets with mobile-first CSS grids. The mobile navigation menu collapses smoothly, and the login dialog contextually positions itself under primary viewport coordinates on smaller devices.

My Experience with GitHub Copilot

This project went from an abandoned, locked-down draft layout to a live, production-grade cloud application in record time because GitHub Copilot acted as an experienced engineering peer right inside VS Code. Here is exactly how Copilot accelerated the development process:

Handling complex Firebase Lifecycles: Copilot was incredibly efficient when writing asynchronous state wrappers inside ContentContext.jsx and AuthContext.jsx. It generated clean error boundaries, cleanly initialized the core configurations inside src/lib/firebase.js, and anticipated subscription cleanups (unsubscribe()) to avoid database leaks.

Mathematical Vector Math: Writing custom HTML5 Canvas rendering logic manually can feel tedious. Copilot instantly scaffolded the mathematical bounding box physics for the network nodes, allowing the circuit lines to trace toward the user’s mouse movements smoothly.

Eliminating Asset Font Dependencies: To ensure total layout reliability without massive external font files slowing things down, Copilot swiftly wrote lightweight inline SVGs for all my technical branding icons and social footers.

Vite Optimization Insights: When the compiler threw chunk size optimization alerts, Copilot helped me track down the dependencies, suggesting clean lazy loading paths and code splitting strategies to keep the application lightning fast.



Source link

🤫 Firebase Is Quietly Preparing for an Offline-First AI Future



Firebase announcements at Google I/O 2026 covered an array of products and features, but the one that grabbed my attention the most was Firebase itself. Most people are understandably focused on Gemini integrations, AI Studio, and the new SQL capabilities inside Firebase, but I believe there is something deeper happening underneath these announcements.

Firebase introduced offline caching support, which helps applications remain responsive even in little or no connectivity. Combined with local and hybrid AI inference, this suggests that Firebase is quietly moving toward an offline-first, hybrid-intelligence model.

A large number of companies are transitioning to the cloud because of the convenience of not managing physical infrastructure and data servers. However, cloud dependency comes with its own trade-offs. Heavy reliance on cloud infrastructure introduces dependence on continuous high-speed internet connectivity, recurring subscription costs, and potential vendor lock-in.

The reality is that not every place in the world has fast and stable internet connectivity. Offline caching can help reduce cloud costs while improving application responsiveness, even in low-connectivity environments.

Modern Applications Are Too Cloud Dependent

Modern applications often assume that users:

have constant internet access,
can perform fast cloud API calls with low latency,
and are always connected to online AI services.

In reality, connectivity is far from universal, especially in rural areas, trains, crowded public networks, and emerging markets such as India.

AI has further increased cloud dependence because AI applications continuously send prompts, images, voice data, and user content to remote servers. This increases:

latency,
cloud costs,
bandwidth usage,
and potential privacy concerns.

As a result, “smart applications” can quickly become fragile applications when internet connectivity is lost. AI features stop functioning, synchronization fails, and the overall user experience degrades significantly.

What Firebase Actually Announced

Firebase introduced custom resolvers, allowing developers to extend Firebase Data Connect beyond Cloud SQL and integrate additional data sources. Alongside this, realtime sync improves application UX by enabling live updates and synchronization across devices.

However, the most interesting feature, in my opinion, is offline cache support, which helps applications remain responsive even with limited or no connectivity. Firebase AI Logic also supports local inference with cloud fallback, allowing certain AI workloads to run directly on-device while heavier tasks can still rely on cloud infrastructure when required.

Additionally, Firebase AI Logic simplifies the integration of generative AI features without requiring extensive server-side setup. It supports multiple programming languages, including Kotlin, Java, Swift, and Flutter.

Taken together, these are not isolated features. Firebase appears to be gradually reducing dependence on centralized cloud execution.

Firebase Is Moving Toward an Offline-First AI Architecture

With offline caching, applications can remain usable even without network connectivity by treating local application state as a first-class component. Synchronization can happen later once connectivity is restored. This improves responsiveness, resilience, and overall application UX while reducing the frequency of frustrating “No Internet Connection” screens.

Local AI inference also changes the compute model. Instead of every AI request depending entirely on cloud APIs, certain AI tasks can now happen directly on-device. For example, in an AI-powered note-taking application, features such as summarization, translation, smart suggestions, and classification could potentially run locally without continuously communicating with remote servers.

For heavier reasoning tasks, hybrid inference becomes important. Lightweight tasks can execute locally, while more computationally intensive operations can seamlessly fall back to cloud models when necessary. This creates a distributed intelligence model where computation is shared between the device and the cloud.

Why This Matters for Emerging Markets

Many cloud-first applications are designed around assumptions that often reflect:

Silicon Valley-like infrastructure conditions,
premium hardware,
and stable high-speed internet connectivity.

However, the ground reality is very different for billions of users around the world. Many people rely on affordable Android devices and unstable mobile networks.

Hybrid architectures can help address this gap by enabling:

lower latency,
reduced bandwidth usage,
partially offline AI experiences,
and better accessibility.

This is particularly important for regions such as India, Africa, and Southeast Asia, where connectivity challenges still exist despite massive growth in smartphone adoption.

The Bigger Industry Shift

With the rapid growth of AI, the industry is gradually moving toward edge AI. Examples include:

on-device Gemini,
Apple Intelligence,
AI NPUs in smartphones,
and local LLMs.

The future of AI may not remain fully centralized. Instead, intelligence may become distributed across devices, edge systems, and cloud infrastructure working together collaboratively.

Critique and Challenges

Like any architectural shift, this approach also comes with trade-offs.

Local AI inference introduces the challenge of device fragmentation. Not all devices are capable of handling local AI workloads efficiently. On-device inference can also increase battery consumption and thermal load.

Hybrid architectures are often more difficult to monitor, debug, and optimize compared to traditional centralized cloud systems.

There is also the issue of vendor lock-in. Heavy dependence on tools such as Firebase, Gemini, and the broader Google Cloud ecosystem could limit developer flexibility over time.

Finally, local models still have computational limitations compared to larger cloud-hosted models.

Conclusion

I believe the Firebase announcements at Google I/O 2026 were not simply about adding more AI capabilities. They reflected a broader shift in how modern applications may operate in the future: less dependent on permanent connectivity, more resilient at the edge, and increasingly capable of running intelligence closer to the user.

The most important AI infrastructure trend may not be larger models alone, but the gradual movement of intelligence from centralized cloud systems toward user devices themselves.

If you liked the blog, consider sharing it among your peers and follow me on Linkedin, Twitter and subscribe to my Youtube Channel.



Source link