Home About Skills Services Projects Contacts

<SS/>

Salman Sahed

SYSTEM_LOADING...

SALMAN.

Full-Stack MERN & Next.js Web Developer crafting high-performance, pixel-perfect digital experiences.

About Skills Services Projects Testimonials Contact

Crafted with Passion & Precision

Emergency Service Directory | Salman Sahed | Salman Sahed

Case Study

Emergency Service Directory

Description

A modern, responsive web application designed to provide quick access to essential emergency service numbers in Bangladesh. Users can easily find, copy, and dial emergency contacts directly from the dashboard.

Key Challenges

Sticky Sidebar: Keeping the history panel fixed while maintaining responsiveness.
State Syncing: Managing dynamic changes in history and favorites simultaneously.

Future Roadmap

Search Bar: Add a real-time search option to find specific services quickly.
Local Storage: Save favorites and call history so data remains after refresh.
Dark Mode: Implement a dark theme for better visibility during night use.

Tools & Tech Stack

React.jsTailwind CSSReact Toastify

Timestamp Accuracy: Generating precise, real-time logs for every single call.

Layout Structure: Preventing text overflow on smaller screens for long names.

Copy Tracking: Handling state updates correctly for individual copy counters.

Location Filters: Filter emergency contacts based on specific districts.

Offline Support: Turn the application into a PWA for completely offline access.

Key Features

Quick Dialing: Dedicated cards to dial emergency contacts with one click.
Call History: Logs all dialed numbers automatically with real-time timestamps.
Clipboard Copy: Easy one-click number copying with an active copy counter.
Favorites System: Users can bookmark essential emergency cards for quick access.
Sticky Sidebar: History panel stays fixed while scrolling through active cards.

Key Learnings

State Control: Mastered React Hooks for managing dynamic user interaction data.
Tailwind Layouts: Learned advanced CSS positioning for complex sticky sidebars.
UX Optimization: Understood the importance of instant click feedback for users.
Responsive UI: Gained experience in building seamless layouts for all devices.
Data Structure: Learned how to store and map array objects for history logs.

Want a similar project?

Let's collaborate and build something extraordinary together.