Getting Started

Introduction

Banner
Dreams EMR Dreams EMR - Electronic Medical Record Admin Dashboard Template

Dreams EMR - Electronic Medical Record Admin Dashboard Template

Contact Support Create Support ticket

Requirements

System Overview

The Dreams EMR template requires a modern Laravel development environment with PHP 8.2+ support, essential extensions, and development tools for optimal performance and development experience.

Core Technologies
Backend Framework

Laravel 12.26.4

Frontend Framework

Bootstrap 5.3.8

Programming Language

PHP 8.4

System Requirements
Composer

For dependency management

PHP Extensions

bcmath, ctype, fileinfo, json, mbstring, openssl, pdo, tokenizer, xml

Node.js

For Vite build process & SCSS compilation

Text Editor

VS Code, Sublime Text, or any code editor

Development Tools
Local Server

XAMPP/WAMP/MAMP

Version Control

Git

Web Browser

Any modern browser

Important Note

Ensure all PHP extensions are enabled in your server configuration. For production deployment, consider using a managed hosting service that supports Laravel 12.x and PHP 8.2+.

Features

Core Features
Patient Management

Registration, profiles, medical history tracking, and comprehensive patient data management.

Doctor Management

Doctor profiles, specialties, schedule management, and professional credential tracking.

Appointment System

Calendar integration, email notifications, status tracking, and automated scheduling.

Billing & Invoices

Invoice generation, payment tracking, financial reports, and automated billing.

Medical Records

Secure patient data storage, retrieval, and comprehensive medical history management.

Dashboard & Analytics

Real-time insights, performance metrics, and comprehensive healthcare analytics.

Technical Features
Laravel 12x

Modern PHP framework architecture

Composer Management

Package dependency management

Routing System

Flexible URL routing & middleware

PHPUnit Testing

Laravel testing framework

Json Data Handling

File-based data processing

MVC Architecture

Laravel MVC pattern structure

UI/UX Features
Modern Design

Creative and contemporary UI

Responsive Bootstrap 5.3.8

Mobile-first responsive design

SCSS Styling

Advanced CSS preprocessing

Font Awesome & Tabler

Comprehensive icon libraries

Easy Customization

Color and font customization

W3C Validated

Cross-browser compatibility

File Structure

Project Overview

The project follows Laravel's MVC architecture with clear separation of concerns and modern development practices.

dreams-emr/ (Root Project)
laravel/ (Main Application)
template/ (Template Files)
app/ (Application Logic)
Http/ (HTTP Layer)
Controllers/ (Request Handlers)
PharmacyController.php (Pharmacy Management)
PatientsController.php (Patient Management)
PatientDetailsController.php (Patient Details)
ApplicationsController.php (Applications)
DoctorsController.php (Doctor Management)
SettingsController.php (System Settings)
StaffsController.php (Staff Management)
VisitsController.php (Visit Management)
Controller.php (Base Controller)
Models/ (Eloquent Models)
User.php (User Model)
Providers/ (Service Providers)
AppServiceProvider.php (Application Service Provider)
bootstrap/ (Framework Bootstrap)
app.php (Application Bootstrap)
config/ (Configuration Files)
app.php (App Configuration)
database.php (Database Config)
auth.php (Authentication)
database/ (Database Files)
migrations/ (Database Schema)
seeders/ (Data Seeders)
factories/ (Model Factories)
public/ (Public Assets)
build/ (Compiled Assets)
css/
Stylesheets
js/
JavaScript
img/
Image and media files
json/
Json Data Files
plugins/
Third Party libraries
scss/
Sass Source
.htaccess (Apache Configuration)
index.php (Entry Point)
favicon.ico (Favicon)
robots.txt (SEO Robots)
resources/ (Source Resources)
css/
Stylesheets
js/
JavaScript
img/
Image and media files
json/
Json Data Files
plugins/
Third Party libraries
scss/
Sass Source
views/ (Blade Templates)
components/ (Reusable Components)
modal-popup.blade.php (Modal Components)
layout/ (Page Layouts)
partials/ (Layout Partials)
vendor-scripts.blade.php (Script Includes)
theme-settings.blade.php (Theme Configuration)
title-meta.blade.php (Page Meta Tags)
topbar.blade.php (Top Navigation)
footer.blade.php (Page Footer)
head-css.blade.php (CSS Includes)
sidebar.blade.php (Navigation Sidebar)
mainlayout.blade.php (Main Layout)
index.blade.php (Dashboard Home)
login.blade.php (Login Page)
patients.blade.php (Patients Management)
doctors.blade.php (Doctors Management)
appointments.blade.php (Patient Appointments)
visits.blade.php (Patient Visits)
pharmacy.blade.php (Pharmacy Management)
ui-*.blade.php (UI Components)
layout-*.blade.php (Layout Variations)
*.blade.php (Additional View Files)
routes/ (Route Definitions)
web.php (Web Routes)
api.php (API Routes)
storage/ (File Storage)
app/ (App Storage)
logs/ (Log Files)
tests/ (Testing)
Feature/ (Feature Tests)
Unit/ (Unit Tests)
vendor/ (Composer Dependencies)
laravel/framework (Laravel Core)
Other PHP packages (Dependencies)
.gitignore (Git Exclusions)
.htaccess (Apache Configuration)
composer.json (Laravel Dependencies)
package.json (Node.js Dependencies)
phpunit.xml (Testing Configuration)
vite.config.js (Vite Build Config)
Legend
Directories
PHP Files
Media Files
JavaScript Files
Laravel Blade Files
CSS Files
SCSS Files
JSON Files
Git Files
Other Files

Laravel Structure

Laravel Blade Template Structure

Dreams EMR uses Laravel's Blade templating engine with a master layout file and individual page templates for consistent design and functionality. Below are the actual files from the project.

Main Layout File

This is the actual master layout file from the project that provides the common HTML structure, navigation, and scripts for all pages:

<!DOCTYPE html>
@include('layout.partials.theme-settings')

<head>
    @include('layout.partials.title-meta')

    @include('layout.partials.head-css')
</head>

@include('layout.partials.body')

<!-- Start Main Wrapper -->
<div class="main-wrapper">

    @include('layout.partials.menu')

        @yield('content') 

    @component('components.modal-popup')
    @endcomponent

</div>
<!-- End Main Wrapper -->

@include('layout.partials.vendor-scripts')
</body>
</html>
Sample Page Template

This is the actual starter page template from the project that extends the main layout:

<?php $page = 'starter-page'; ?>   
@extends('layout.mainlayout')
@section('content')

    <!-- ========================
        Start Page Content
    ========================= -->

	<!-- Page HTML content goes here -->

    <div class="page-wrapper">

        <!-- Start Content -->
        <div class="content">

		    <!-- Your page content -->

        </div>
        <!-- End Content -->    

        @include('layout.partials.footer')

    </div>
    
    <!-- ========================
        End Page Content
    ========================= -->

@endsection
Key Blade Template Features
Template Inheritance

@extends directive for master layout structure

Content Sections

@section and @yield for dynamic content injection

Partial Includes

@include directive for reusable partials (topbar, sidebar, footer)

Route Conditions

@if Route::is() for conditional layout rendering

Component System

@component directive for modal popup components

PHP Variables

PHP variables for page identification and routing

Installation Guide

Laravel Framework Setup

Follow these steps to set up Dreams EMR Laravel application on your local development environment. This guide covers Laravel-specific installation, environment configuration, and project setup.

Installation Steps
1
Environment Setup

Ensure you have the required software installed:

Composer
MySQL/SQLite
Web Server (Apache/Nginx)
Tip: Use XAMPP, WAMP, or MAMP for local development
2
Project Setup

Extract the Dreams EMR Laravel project to your web server directory:

XAMPP: htdocs/dreams-emr/laravel/template
WAMP: www/dreams-emr/laravel/template
3
Install PHP Dependencies

Open terminal/command prompt in the Laravel project directory and run:

composer install
Note: Ensure Composer is installed on your system
4
Install Node.js Dependencies

Install frontend dependencies for SCSS compilation:

npm install
Note: Ensure Node.js and npm are installed on your system
5
Environment Configuration

Configure your Laravel environment:

cp .env.example .env
php artisan key:generate
Configure: Update database settings in .env file
6
Database Setup

Set up your database and run migrations:

php artisan migrate
7
Build Frontend Assets

Compile SCSS and build frontend assets:

npm run build
Development: Use npm run dev for live compilation
8
Access Application

Start your web server and access the Laravel application:

php artisan serve
Example URLs:
Artisan Server: http://127.0.0.1:8000
Live Server: yourdomain.com/laravel/template/public

Sass, Scss Installation

Overview

Sass (Syntactically Awesome Style Sheets) is a CSS preprocessor that extends CSS with variables, nesting, mixins, and more. This guide covers the installation and setup of Sass for the Dreams EMR template.

Prerequisites
Node.js Installation

Before installing Sass, ensure you have Node.js installed on your system:

Installation Steps
1
Install NPM Package Manager

Install the latest version of npm package manager:

npm install -g npm@latest
Note: This ensures you have the latest npm version
2
Install Sass Globally

Install Dart Sass globally using npm:

npm install -g sass
3
Verify Installation

Check if Sass is installed correctly:

sass --version
Compilation Methods
Method Description Default Sass Command npm Script Command
One-time Compilation (Production)

Compile SCSS files once for production with minified output

 sass resources/scss/main.scss:resources/css/style.css --style=compressed npm run sass
Watch Mode (Development)

Automatically recompile on file changes for real-time development

 sass resources/scss/main.scss:resources/css/style.css --style=compressed --watch npm run sass:watch
Run Without Source Map (Production/Optional)

Compile SCSS without generating source maps, ideal for production builds

 sass resources/scss/main.scss:resources/css/style.css --style=compressed --no-source-map npm run sass:no-map
Best Practices
Development
  • Use watch mode for real-time updates
  • Enable source maps for debugging
  • Organize SCSS with partials
Production
  • Use compressed output style
  • Minimize file size
  • Optimize for performance

Dynamic Title Feature

Overview

The Dreams EMR Laravel application implements an intelligent title generation system that analyzes route names and page identifiers to create dynamic, user-friendly page titles. This system leverages Laravel's Blade templating engine and route system for automatic title generation.

File Location: resources/views/layout/partials/title-meta.blade.php
This Blade partial contains the title generation logic
Key Features
Route-Based Titles

Generates titles from Laravel routes

Smart Acronym Detection

Converts acronyms to uppercase

Smart Word Processing

Converts route names to proper title case

SEO Optimized

Creates search-engine friendly titles

Automatic Generation

Reduced manual maintenance

Consistent Formatting

Professional and polished title appearance

Examples
  • # Page Variable → Generated Title
  • appointment-consultation → "Appointment Consultation"
  • ui-alerts → "Alerts"
  • icon-bootstrap → "Bootstrap Icons"
  • chart-js → "JS Charts"
How It Works
  1. Page variable is declared in Blade view
  2. title-meta.blade.php partial reads the variable
  3. Converts hyphens to spaces
  4. Applies proper title case formatting
  5. Generates final title with app name
Title Format

All generated titles follow this consistent format:

<title>{Generated Title} | Dreams EMR - Responsive Bootstrap 5 Medical Admin Template</title>
Example Output

For $page = 'starter-page':

Starter Page | Dreams EMR - Responsive Bootstrap 5 Medical Admin Template

Note

The system automatically handles title generation based on the page variable. For custom titles, you can either modify the page variable or implement controller-based title passing. The title-meta.blade.php partial is included in the main layout for consistent title generation across all pages.

JSON Data Management

Overview

The Dreams EMR Laravel application uses JSON files for data storage and retrieval, providing a lightweight alternative to databases for small to medium datasets. This approach is particularly useful for static data, configuration settings, and sample data that doesn't require frequent updates.

Key Features
Easy Maintenance

Simple to read, modify and update

Error Handling

Robust file operation handling

Fast Processing

Quick data loading

Blade Integration

Seamless integration with Blade templates

Configuration Ready

Perfect for settings data

Structured Data

Consistent JSON schema

Implementation

Load JSON data in Laravel with error handling:

Route Method (web.php)
// routes/web.php
Route::get('/all-patients-list', [PatientsController::class, 'AllPatientsList'])->name('all-patients-list');
Controller Method
// In Controller
public function AllPatientsList()
{
    $jsonContent = file_get_contents('build/json/all-patients.json');
    if ($jsonContent !== false) {
        $allPatientsList = json_decode($jsonContent, true);
    } else {
        $allPatientsList = [];
    }
    return view('all-patients-list', compact('allPatientsList'));  
}
Blade Template Usage
@forelse($allPatientsList as $patient)
<tr>
    <td><a href="{{url('patient-details')}}">{{ $patient['patient_id'] }}</a></td>
    <td>
        <div class="d-flex align-items-center">
            <a href="{{url('patient-details')}}" class="avatar avatar-xs me-2">
                <img src="{{ $patient['avatar'] }}" alt="patient" class="rounded">   
            </a>
            <div>
                <h6 class="fs-14 mb-0 fw-medium">
                    <a href="{{url('patient-details')}}">{{ $patient['name'] }}</a>
                </h6>
            </div>
        </div>
    </td>
    <td>{{ $patient['gender'] }}</td>
    <td>{{ $patient['department'] }}</td>
</tr>
@empty
<tr><td colspan="4">No patients found</td></tr>
@endforelse
File Structure
resources/
json/
appointments.json (Appointment data)
all-patients.json (Patient list data)
all-doctors.json (Doctor list data)
invoices.json (Invoice records)
..etc (Other JSON files)

RTL Language Support

Overview

The Dreams EMR Laravel application includes comprehensive RTL (Right-to-Left) language support for Arabic, Hebrew, and other RTL languages. RTL is implemented through route-based conditional rendering and CSS loading.

Implementation

RTL support is implemented through multiple components working together:

HTML Direction Setting

The HTML direction is set conditionally in layout/partials/theme-settings.blade.php:

@if (Route::is(['layout-rtl']))
<html lang="en" dir="rtl">
@endif
Conditional CSS Loading

RTL-specific CSS is loaded conditionally in layout/partials/head-css.blade.php:

@if (!Route::is(['layout-rtl']))
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="{{URL::asset('build/css/bootstrap.min.css')}}">
@endif  

@if (Route::is(['layout-rtl']))
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="{{URL::asset('build/css/bootstrap.rtl.min.css')}}">
@endif
Key Features
  • Route-based RTL detection using Route::is()
  • Automatic HTML direction attribute setting
  • Conditional Bootstrap RTL CSS loading
  • Seamless integration with existing layouts
  • Easy to implement on new pages
Note

Access /layout-rtl route to see the RTL layout sample. The RTL implementation automatically handles CSS loading and HTML direction based on the current route.

Theme Mode Switcher

Overview

The template includes a live dark mode toggle in the header that allows users to switch between light and dark themes instantly. This feature provides better user experience in different lighting conditions.

How to Access

Dark mode is accessible through the header toggle button:

<!-- Light/Dark Mode Button -->
<div class="header-item d-none d-sm-flex me-2">
    <button class="topbar-link btn topbar-link" id="light-dark-mode" type="button">
        <i class="ti ti-moon fs-16"></i>
    </button>
</div>
Implementation

Dark mode is implemented using JavaScript in theme-script.js:

// JavaScript implementation in theme-script.js
document.getElementById("light-dark-mode").addEventListener("click", function(e) {
    "light" === config.theme ? 
        changeLayoutColor("dark") : 
        changeLayoutColor("light")
});
Key Features
  • Live theme switching without page reload
  • User preference persistence
  • Bootstrap 5 dark theme integration
  • Improved readability in low light
Note

The dark mode toggle is available in the header on all pages. Users can switch themes instantly without losing their current work.

How to change Font ?

You can change the font you can edit it from Scss file.

@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@300;400;500;600;700;800&display=swap');

	body {
		font-family: 'Manrope', sans-serif;
	}

How to change Header Background Color ?

You can change the header background color in style.css as per your wish


	.header {
		background: #fff;
		left: 0;
		position: fixed;
		right: 0;
		top: 0;
		height: 66px;
	}

Typography

h1. Bootstrap heading

h2. Bootstrap heading

h3. Bootstrap heading

h4. Bootstrap heading

h5. Bootstrap heading
h6. Bootstrap heading

Icons

Use Font Awesome icons with spesific class 


	<!DOCTYPE html>
	<html lang="en">
		<head>
			<link rel="stylesheet" href="{{URL::asset('build/plugins/fontawesome/css/fontawesome.min.css')}}">
			<link rel="stylesheet" href="{{URL::asset('build/plugins/fontawesome/css/all.min.css')}}">
		</head>
	</html>



	<i class="fas fa-times"></i>
	<i class="fas fa-chevron-down"></i>
	<i class="fa-regular fa-user"></i>

FAQs

With one purchase code you can use it on one domain name. You need to get new license for every new domain name, please check Envato Help Page for more information about licenses.

If you need support, or if you're facing any problems, please contact us via Envato Support
Please note that our respond can take up to 2 business days.

  • Availability to answer questions, Answering technical questions about item's features, Assistance with reported bugs and issues, Help with included 3rd party assets.
  • Any customization request will be ignored.
  • Please make sure to read more about the support policy.

Support

If this documentation does not address your questions, please feel free to contact us via email at Item Support Page

We are in the GMT+5:30 time zone and typically respond to inquiries on weekdays within 12-24 hours. Please note that in rare cases, the response time may extend to 48 hours, especially during holiday seasons.

Note:

We strive to offer top-notch support, but it's only available to verified buyers and for template-related issues such as bugs and errors. Custom changes and third-party module setups are not covered.

Don't forget to Rate Dreams EMR!
Please take a moment to rate our product on Themeforest. Your support means a lot to us. Just go to your Themeforest Profile > Downloads Tab, and you can leave a review for our script. Thank you!

License

Dreams EMR is developed by Dreams Technologies and is available under both Envato Extended & Regular License options.

Regular License

Usage by either yourself or a single client is permitted for a single end product, provided that end users are not subject to any charges.

Extended License

For use by you or one client in a single end product for which end users may be charged.

What are the main differences between the Regular License and the Extended License?

Note

If you operate as a freelancer or agency, you have the option to acquire the Extended License, which permits you to utilize the item across multiple projects on behalf of your clients.

Credits

Plugin Name URL
Bootstrap https://getbootstrap.com/docs/
jQuery https://jquery.com/
Fontawesome https://fontawesome.com/
Select2 https://github.com/select2/select2
Date Timepicker https://cdnjs.com/libraries/jquery-datetimepicker
Google Fonts https://fonts.google.com/
Fancy Box http://fancybox.net/
Moment JS https://momentjs.com/
theia-sticky-sidebar https://github.com/WeCodePixels/theia-sticky-sidebar
Range-Slider https://ionicframework.com/docs/api/range

Do you need a customized application for your business?

If you need a customized application for your business depends on your specific requirements and goals, Please contact us.

Customization can be the key to success, ensuring your project perfectly aligns with your unique goals and requirements.

Don't Miss Out on the Benefits of Customization!

Unlock the potential of your project. It's time to ensure that your project isn't just another cookie-cutter solution but a truly unique and effective one.

Discover how customization can make a difference in your project's success. Let's create a solution that's as unique as your vision!

  • We'll tailor the application to meet your specific needs and preferences.
  • We will upload your website to the server and ensure it is live.
Book an Appointment Get a Free Quote
dreamstechnologies [email protected]
thanks

Thank You

Thank you once again for downloading Dreams EMR.
We hope you're enjoying your experience, and we kindly request that you take a moment to share your valuable review and rating with us.

Review Link:https://themeforest.net/downloads