Introduction Last updated: 2024-10-09

Welcome to Alicom Your Comprehensive Single-Vendor E-Commerce Solution

Alicom is a flexible and powerful eCommerce platform designed for single vendors who seek to create, manage, and scale their online businesses with ease. Alicom combines simplicity with powerful features, allowing businesses to thrive in today’s competitive digital marketplace. Whether you're launching a new store or upgrading an existing one, Alicom provides the tools you need for seamless e-commerce management.

Key Features

  • Intuitive User Interface: Alicom offers a streamlined and easy-to-navigate interface, ensuring that vendors can manage products, orders, and customer interactions efficiently.
  • Product Management: Add, edit, and organize products effortlessly. Customize product categories, descriptions, pricing, and images, enabling you to showcase your offerings in the best light.
  • Secure Payment Gateway Integration: Alicom supports multiple secure payment gateways, providing a safe and reliable payment experience for both vendors and customers.
  • Inventory Management: Track stock levels and set automated alerts for low inventory, ensuring smooth operations and uninterrupted sales.
  • Order and Shipping Management: Handle customer orders, shipping details, and delivery tracking from a unified dashboard. Alicom makes order processing efficient and hassle-free.
  • Customizable Storefront: Tailor your store’s design with customizable themes, fonts, and layouts, ensuring that your online presence reflects your brand identity.
  • Analytics and Reporting: Gain insights into sales performance, customer behavior, and revenue trends with detailed reports and analytics. Make data-driven decisions to enhance your business strategy.
  • Mobile Responsive Design: Alicom’s responsive design ensures your store looks great on any device, offering a seamless shopping experience across desktop and mobile platforms.
  • SEO Optimization: Boost your store’s visibility with built-in SEO tools, making it easier for customers to find your products through search engines.
  • Multi-Language and Multi-Currency Support: Expand your reach with multi-language and multi-currency support, making Alicom ideal for international sales.

What You Get

  • Alicom Laravel Admin: Manage every aspect of your store from an intuitive and powerful admin panel. It offers features like product management, customer handling, order processing, and reporting.
  • Mobile App (Optional): Offer your customers a dedicated mobile shopping experience with our mobile app, built on the Flutter framework. This app allows customers to browse, purchase, and track orders effortlessly from their mobile devices.
  • Customizable Vue.js Website: Alicom includes a fully responsive website built with Vue.js, offering customers a dynamic and smooth shopping experience while being easy for vendors to manage.

Installation and Customization

  • Step-by-Step Installation Guides: Alicom provides comprehensive documentation to assist with the installation of the Laravel admin panel and the Vue.js storefront. From server setup to final deployment, each step is clearly outlined to ensure a smooth process.
  • Customization Support: Tailor Alicom to meet your business needs. The documentation includes guides on how to customize various elements, such as the user interface, product pages, and branding options, allowing you to make the platform truly yours.

What’s Included

  • Full source code for the Alicom Laravel Admin.
  • Complete Flutter source code for the optional mobile application.
  • Full source code for the Vue.js website.
  • Comprehensive documentation for installation and customization.
  • Free updates and dedicated support to keep your platform up-to-date and running smoothly.

Get Started Today!

Elevate your e-commerce business with Alicom. Whether you're a small retailer or an established vendor, Alicom gives you the tools to create a professional and successful online store. Get started today and transform your digital sales experience.

Alicom Mobile App 1.1

1. Cross-Platform Compatibility:

  • Flutter-Powered: Alicom offers a seamless and high-performance experience across both Android and iOS devices. Built using Flutter, it ensures smooth integration of updates and features across platforms, reducing development time and costs.
  • Responsive Design: Alicom’s layout is optimized for various screen sizes, providing a consistent experience on both smartphones and tablets. Whether on a 5-inch phone or a 10-inch tablet, the design adapts fluidly to different orientations.

2. User-Friendly Interface:

  • Modern UI/UX Design: Alicom features a sleek, intuitive interface designed for ease of navigation. The modern design principles focus on usability, clarity, and aesthetic appeal, enhancing the user’s shopping experience.
  • Dark & Light Themes: Users can choose between dark and light themes based on their preferences. The app can also adapt to the device's system settings, offering user comfort during extended use.

3. Product Management:

  • Comprehensive Product Library: Manage a vast product catalog effortlessly through a robust backend. Alicom allows easy bulk uploads, efficient categorization, and real-time inventory management.
  • High-Quality Images: Showcase products with high-quality images. Alicom supports multiple product images, including zoom features and 360-degree views, giving customers detailed product visuals.

4. Cart & Checkout:

  • Cart Management: Users can add, edit, or remove items from their cart easily. The cart dynamically updates with estimated totals, taxes, and shipping costs for a transparent purchase process.
  • Secure Checkout: A straightforward, secure checkout process allows users to complete purchases confidently. Alicom supports guest checkout, saving user information for future purchases, and integrates with various payment gateways.

5. Advanced Search & Discovery:

  • Smart Search: Alicom’s powerful search engine allows users to find products quickly, with filter options such as price, brand, and category to refine results.
  • Personalized Recommendations: Alicom uses machine learning to provide personalized product suggestions based on user behavior and purchase history, enhancing the overall shopping experience.

6. User Accounts & Profiles:

  • User Registration & Login: Alicom supports secure registration and login options, including social media login. Users can also enable two-factor authentication for enhanced security.
  • Profile Customization: Users can customize their profiles with avatars, shipping addresses, and payment methods. They can view order history and manage their notifications.
  • Order Tracking: Real-time order tracking ensures users can follow their purchases from payment to delivery, with notifications at each shipping stage.

7. Subscription & Monetization:

  • Multiple Payment Options: Alicom offers various payment methods, including credit cards and PayPal, making transactions seamless for users across different regions.
  • Discounts & Promotions: Sellers can create promotional offers, including discount codes and time-limited sales, directly from the app’s admin panel to boost engagement and sales.

8. Multi-Language & Localization:

  • Multi-Language Support: Alicom is designed for a global audience, supporting multiple languages with accurate localization for product descriptions, UI elements, and notifications.
  • RTL Support: Alicom ensures compatibility with Right-to-Left languages like Arabic and Hebrew, adjusting layouts and text direction automatically based on language selection.

9. Customer Support & Feedback:

  • In-App Support: Alicom offers in-app customer support via live chat, email, or phone. A comprehensive FAQ section addresses common user inquiries and issues.
  • User Feedback: Users can leave product feedback via ratings and reviews, helping improve offerings through valuable customer insights.

10. Security & Privacy:

  • Data Protection: Alicom complies with GDPR and international privacy regulations. User data is encrypted and securely stored, ensuring the highest standards of privacy protection.
  • Secure Transactions: All financial transactions are encrypted and processed through trusted payment gateways, minimizing fraud risks and ensuring user confidence.

11. Analytics & Reporting:

  • Real-Time Analytics: Alicom provides real-time insights on sales and user behavior. Sellers can analyze product performance, inventory, and marketing effectiveness.
  • Detailed Reports: Generate detailed reports on sales and customer demographics to support informed business decisions.

12. Notifications & Alerts:

  • Push Notifications: Keep users informed about new products, special offers, and updates through push notifications.
  • In-App Alerts: Important updates and product recommendations are delivered directly within the app, ensuring users are always up-to-date.

13. Secure & Scalable Backend:

  • Laravel Backend: Alicom’s backend is built on Laravel, ensuring robust content management, user authentication, and data handling.
  • Scalable Infrastructure: The backend is designed to handle large user volumes and growing data, making Alicom an ideal choice for scalable eCommerce operations.

14. Regular Updates & Support:

  • Ongoing Updates: Alicom receives regular updates, ensuring the app remains up-to-date with new features and performance improvements.
  • Comprehensive Documentation: Alicom comes with detailed documentation, guiding users through setup, customization, and deployment.

Alicom Vue.js Website 1.2

Overview

The Alicom Vue.js website is a high-performance, single-vendor eCommerce web application designed for seamless shopping experiences. Built with the Vue.js framework, it offers fast load times, a responsive user interface, and real-time synchronization with the Alicom mobile app and admin panel. Its component-based architecture enhances development efficiency, while features like state management, routing, and SEO optimization ensure scalability. Alicom is optimized to support sustained business growth by delivering an intuitive and engaging user experience.

Key Features

Modern & Responsive Design

  • Cross-Browser Compatibility: Optimized for major browsers, including Chrome, Firefox, Safari, and Edge, for consistent user experiences.
  • Responsive Layout: Automatically adjusts to various screen sizes, providing a flawless shopping experience on desktops, tablets, and smartphones.
  • Customizable Themes: Choose from a variety of themes to match your brand identity.

Comprehensive Product Management

  • Product Catalog: Easily manage your product range with options to add, edit, categorize, and describe items with rich content, including images, descriptions, and pricing.
  • Inventory Control: Monitor stock levels in real time with automatic alerts for low inventory, ensuring products are always available.
  • Bulk Uploads: Upload large volumes of products quickly using bulk upload features, saving time and reducing errors.

Advanced Order Management

  • Real-Time Order Tracking: Track orders from placement to delivery with real-time updates for both admins and customers.
  • Order History & Management: Access detailed records of past orders, including status, payment information, and customer details.
  • Automated Notifications: Keep customers informed with email or SMS notifications about order confirmations, shipping updates, and delivery statuses.

Payment Integration & Security

  • Multiple Payment Gateways: Integrate with popular payment gateways, offering customers a variety of secure payment options.
  • Secure Transactions: Protect all transactions with encrypted payment processing, ensuring compliance with industry standards like PCI DSS.
  • Fraud Prevention: Implement advanced fraud detection to secure sensitive customer data and prevent unauthorized transactions.

Customer Engagement & Loyalty

  • Personalized Marketing: Use customer data to send targeted promotions, discounts, and product recommendations via email or in-app notifications.
  • Loyalty Programs: Reward repeat customers with loyalty points, discounts, or exclusive offers to drive long-term engagement.
  • Customer Support Chat: Provide real-time support via integrated chat features, ensuring quick resolution of queries and issues.

Advanced Search & Filtering

  • Smart Search: Help customers find products quickly with predictive text and auto-suggestions.
  • Advanced Filtering: Let users filter products by categories, price, and other attributes, making it easy to locate items.
  • Product Recommendations: Provide personalized suggestions based on browsing history and previous purchases.

Cart & Checkout

  • Shopping Cart Management: Enable users to easily add, remove, and manage items in their cart, with a clear overview of selected products and total costs.
  • Streamlined Checkout: Simplify the checkout process with an intuitive interface that supports guest checkout.
  • Multiple Payment Options: Offer various payment methods, such as credit cards and digital wallets, to ensure convenience for customers.

Analytics & Reporting

  • Sales Reports: Generate reports on sales performance, revenue, and product trends to guide business decisions.
  • Customer Insights: Analyze customer behavior, including purchase patterns, average order value, and demographics.
  • Inventory Reports: Monitor stock levels, turnover rates, and availability with detailed inventory reports.

Admin Panel

  • User Management: Manage user accounts and monitor customer activity easily through the admin panel.
  • Content Management: Update product details, promotions, and website banners with ease.
  • System Configuration: Customize system settings, including payment gateway configurations and shipping options.

Security & Performance

  • Robust Security: Safeguard user data with SSL encryption, two-factor authentication, and other advanced security protocols.
  • Scalable Infrastructure: Handle high traffic and large volumes of transactions efficiently, ensuring smooth performance as your business grows.
  • Regular Updates: Stay up-to-date with ongoing updates for improved security and feature enhancements.

Marketing & Promotions

  • Discount Management: Create and manage discounts, coupon codes, and special offers to boost sales.
  • Email Marketing Integration: Run targeted email campaigns with promotions, product updates, and personalized recommendations.
  • Social Media Integration: Drive traffic by enabling social media sharing of products and promotions.

Notifications & Alerts

  • Push Notifications: Notify customers about new products, special offers, and order updates in real time.
  • Admin Alerts: Receive critical alerts about low stock, high traffic spikes, or payment issues to ensure smooth operations.

Alicom Admin Panel 1.2

Introduction

The Alicom Laravel Admin Panel serves as the central management interface for administrators to oversee the functionalities of the single-vendor e-commerce platform. Designed with user experience in mind, this admin panel leverages the robust capabilities of the Laravel framework to facilitate efficient management of products, orders, users, and content.

Key Features

1. User Management

Role-Based Access Control:

   - Admins can define roles and permissions for users (e.g., administrators, vendors, customers) to ensure secure access to functionalities based on their responsibilities.

User Profiles:

   - Administrators can view, edit, and manage user profiles, including personal information, order history, and account status.

User Enrollment:

   - Easily register users and manage their accounts, streamlining the onboarding process.

2. Product Management

Create & Edit Products:

   - Administrators can add new products, update existing product details, and manage product categories and availability.

Inventory Management:

   - Track product stock levels, manage low stock alerts, and ensure timely replenishment of inventory.

Product Variants:

   - Manage different product variants (e.g., size, color) to provide a comprehensive shopping experience.

3. Order Management

Order Tracking:

   - Monitor orders in real-time, update statuses (pending, shipped, delivered), and manage returns and refunds.

Payment Processing:

   - Facilitate various payment methods, ensuring a seamless checkout experience for customers.

Sales Reports:

   - Generate and analyze reports on sales performance, trends, and customer purchasing behaviors.

4. Customer Relationship Management (CRM)

Customer Support:

   - Manage customer inquiries and support requests efficiently, ensuring high levels of customer satisfaction.

Feedback & Reviews:

   - Encourage customer feedback and reviews on products, helping improve offerings and enhance user experience.

5. Configuration & Customization

System Settings:

   - Configure essential platform settings, including payment gateways, shipping options, and tax configurations.

Theme Management:

   - Adjust the appearance of the admin panel to align with organizational branding and preferences.

6. Security & Performance

Data Security:

   - Implement robust security measures to safeguard sensitive user data, including encryption and secure login protocols.

Performance Optimization:

   - The Laravel framework ensures efficient data processing, providing fast loading times and a smooth user experience.

Ongoing Support

For any queries, issues, or feature requests, please refer to the support section at support.razinsoft.com. Our team is committed to providing timely assistance and updates.

Flutter Mobile App Installation

Before you start, ensure you have:

  • Flutter SDK [ 3.22.0 ] : Install the Flutter SDK by following the Flutter installation guide .
  • SDK: Comes bundled with Flutter.
  • IDE: Android Studio, Code, or IDEA and plugins.
  • Device/Emulator: An Android or iOS device/emulator for testing.

Flutter Project Run 2.1

3. Download and Extract the Project:

  • Download the Package: Go to your Codecanyon account and download the AlicomFlutter app package.
  • Extract the Files: Extract the downloaded ZIP file to a preferred location on your computer.

4. Set Up Your Development Environment:

  • Install Flutter and Dart: Follow the instructions on the Flutter installation page to install Flutter and Dart.
  • Configure Your IDE: Install and configure your preferred IDE (Android Studio, VS Code, or IntelliJ IDEA). Install the Flutter and Dart plugins.

5. Open the Project:

  • Open Your IDE: Launch your IDE (Android Studio, VS Code, or IntelliJ IDEA).
  • Open the Project Folder: Use the "Open" or "Import" option in your IDE to open the folder where you extracted the project.

6. Install Dependencies:

  • Open Terminal/Command Prompt: Navigate to the project directory:
    bash
    cd path/to/your/project
  • Install Dependencies: Run the following command to fetch and install the required dependencies:
    bash
    flutter pub get

7. Set Up Emulator or Device:

  • Android Emulator: Open Android Studio and go to the AVD Manager. Create or start an Android Virtual Device (AVD).
  • iOS Simulator (macOS only): Open Xcode and start the iOS Simulator.

8. Run the App:

  • Run the App: Ensure your emulator/device is connected and running. In your IDE, run the following command or use the built-in run feature:
    bash
    flutter run

9. Build the App for Release:

  • For Android: Run the following command to generate a release APK:
    bash
    flutter build apk --release
    The release APK will be located in build/app/outputs/flutter-apk/.
  • For iOS: Run the following command to prepare the app for release:
    bash
    flutter build ios --release
    Open the ios/Runner.xcworkspace file in Xcode to configure the app for distribution and follow Apple’s guidelines.

10. Troubleshooting:

  • Check for Issues: Use the command flutter doctor to diagnose and resolve common setup issues:
    bash
    flutter doctor
  • Common Issues: Ensure you have the necessary environment variables set up. Resolve any dependency issues indicated in the terminal output.

11. Documentation and Support:

  • Refer to the docs/ folder in the project for any additional documentation provided by the Codecanyon author.
  • For further support, contact the Codecanyon author through their support channels.

12. Conclusion:

You should now have the AlicomFlutter mobile app up and running on your device or emulator. If you encounter any issues or need further customization, refer to the project's documentation or seek support from the Codecanyon community.

Feel free to adjust this document according to any specific features or requirements of your app.

Play store Publish 2.2

Alicom- Publishing on Google Play Store

This documentation provides a step-by-step guide to publishing your Flutter Alicom on the Google Play Store.

Prerequisites

  • Flutter SDK installed and configured.
  • A Google Play Developer account.
  • Complete Flutter Alicom ready for production.
  • A keystore file for signing your app.
  • A high-quality app icon (512x512 pixels).
  • App screenshots for the Play Store listing.

Step 1: Prepare Your App for Release

Before publishing, you need to prepare your app for release:

  • Open your Flutter app project.
  • Update the android/app/build.gradle file with your app’s version code and version name:
  • android {
        ...
        defaultConfig {
            ...
            versionCode 1
            versionName "1.0.0"
        }
    }
  • Configure the app name and launcher icon in android/app/src/main/AndroidManifest.xml:
  • <application
        android:label="YourAppName"
        android:icon="@mipmap/ic_launcher">
        ...
    </application>
  • Generate a signed APK or App Bundle by running the following command:
  • flutter build apk --release

    or

    flutter build appbundle --release
  • Your release APK/App Bundle will be located in build/app/outputs/flutter-apk or build/app/outputs/bundle/release.

Step 2: Create a Google Play Developer Account

If you don’t already have a Google Play Developer account, follow these steps:

  • Go to the Google Play Console.
  • Sign in with your Google account and follow the prompts to create a Developer account.
  • Pay the one-time registration fee.
  • Complete your account setup, including entering your developer profile information.

Step 3: Create a New App on Google Play Console

Now that your Developer account is set up, you can create a new app:

  • Log in to your Google Play Console.
  • Click on Create App.
  • Enter your app’s name, select the default language, and choose the app type (e.g., App).
  • Complete the required information, including the app’s description, category, and contact details.

Step 4: Set Up the Play Store Listing

Provide the necessary details for your app's Play Store listing:

  • Enter the app’s title, short description, and full description.
  • Upload your app’s icon (512x512 pixels) and screenshots.
  • Select the app’s category and content rating.
  • Provide contact information and a privacy policy URL (if applicable).

Step 5: Upload the APK or App Bundle

Upload your signed APK or App Bundle to the Play Store:

  • Go to the Release > Production section.
  • Click on Create New Release.
  • Upload the APK or App Bundle you generated earlier.
  • Provide release notes for the version you are publishing.
  • Click Save and then Review Release.
  • After reviewing, click Start Rollout to Production to publish your app.

Step 6: Review and Publish

Once everything is set up, review your app’s details and make sure everything is correct:

  • Check for any errors or warnings in the Play Console.
  • Ensure all required fields are filled out.
  • Submit your app for review by Google.

Once your app passes the review, it will be published on the Play Store, and users can start downloading it.

Step 7: Post-Publishing

After your app is live, you can monitor its performance and manage updates:

  • Use the Play Console to view app analytics, crash reports, and user feedback.
  • Regularly update your app to fix bugs, improve performance, and add new features.
  • Engage with users through reviews and respond to their feedback.

Conclusion

Publishing your Flutter Alicom on the Google Play Store is a straightforward process that involves preparing your app, creating a Play Console account, setting up the store listing, uploading the app, and submitting it for review. Follow these steps carefully to ensure a successful launch.

App store Publish 2.3

Flutter Alicom - Publishing on Apple App Store

This documentation provides a step-by-step guide to publishing your Flutter Alicom on the Apple App Store.

Prerequisites

  • Flutter SDK installed and configured.
  • A Mac computer with the latest version of Xcode installed.
  • An Apple Developer Program membership.
  • Complete Flutter Alicom ready for production.
  • A distribution certificate and provisioning profile.
  • A high-quality app icon (1024x1024 pixels).
  • App screenshots for the App Store listing.

Step 1: Prepare Your App for Release

Before publishing, you need to prepare your app for release:

  • Open your Flutter app project in Xcode.
  • Update the ios/Runner.xcodeproj with your app’s version number and build number:
  • Version: 1.0.0 (1)
  • Configure the app name, bundle identifier, and other settings in ios/Runner/Info.plist:
  • <key>CFBundleName</key>
    <string>YourAppName</string>
    
    <key>CFBundleIdentifier</key>
    <string>com.yourcompany.yourapp</string>
  • Ensure that your app is signed with the correct distribution certificate and provisioning profile.
  • Generate a release build by running the following command:
  • flutter build ios --release
  • Open the generated Xcode project located in ios/ and archive the app using Xcode:
    • In Xcode, go to Product > Archive.
    • After the archive is created, the Xcode Organizer window will open.
    • Click Distribute App and select App Store Connect.
    • Follow the prompts to upload your app to App Store Connect.

Step 2: Create an Apple Developer Account

If you don’t already have an Apple Developer account, follow these steps:

  • Go to the Apple Developer Program enrollment page.
  • Sign in with your Apple ID and follow the instructions to enroll.
  • Pay the annual membership fee.
  • Complete your account setup by accepting the terms and conditions.

Step 3: Set Up App Store Connect

After setting up your Developer account, configure App Store Connect for your app:

  • Go to App Store Connect and sign in.
  • Click on My Apps and then click the + (plus) button to create a new app.
  • Enter your app’s name, primary language, bundle ID, and SKU. Select the correct platform (iOS).
  • Complete the required app information, including app description, keywords, and support URL.

Step 4: Configure App Store Listing

Provide the necessary details for your app's App Store listing:

  • Enter the app’s title, subtitle, and promotional text.
  • Upload your app’s icon (1024x1024 pixels) and screenshots (5.5-inch and 6.5-inch iPhone screenshots required).
  • Select the app’s category and content rating.
  • Provide contact information and a privacy policy URL (if applicable).

Step 5: Submit Your App for Review

After configuring the App Store listing, you can submit your app for review:

  • Go to the App Information section and complete any remaining fields.
  • In the Pricing and Availability section, set your app's price or make it free.
  • Go to the Prepare for Submission section.
  • Select the build you uploaded from Xcode and assign it to this version.
  • Answer any required compliance questions (e.g., export compliance, content rights).
  • Click Submit for Review to send your app to Apple for review.

Step 6: Review and Approval Process

Apple will review your app before it goes live on the App Store:

  • Monitor the review status in App Store Connect. The review process may take a few days.
  • If there are any issues, Apple will contact you with details on what needs to be fixed.
  • Once approved, your app will be published on the App Store.

Step 7: Post-Publishing

After your app is live, you can monitor its performance and manage updates:

  • Use App Store Connect to view app analytics, crash reports, and user feedback.
  • Regularly update your app to fix bugs, improve performance, and add new features.
  • Engage with users through reviews and respond to their feedback.

Conclusion

Publishing your Flutter Alicom on the Apple App Store is a detailed process that involves preparation, account setup, configuring your app in App Store Connect, and submitting it for review. Follow these steps carefully to ensure a successful launch.

FCM Configuration 2.4

FCM Configuration for Flutter Mobile App

This document provides a comprehensive guide to configuring Firebase Cloud Messaging (FCM) for your Flutter mobile app on both Android and iOS platforms.

1. Set Up Firebase Project

  • Go to the Firebase Console.
  • Create a new project or select an existing one.
  • Register your app (both Android and iOS) within the Firebase project.

2. Configure Android for Firebase


2.1 Add Firebase SDK to Your Android Project

  • Download the google-services.json file from the Firebase Console.
  • Place the google-services.json file in the android/app directory of your Flutter project.

2.2 Update `android/build.gradle`

buildscript {
    dependencies {
        // Add this classpath
        classpath 'com.google.gms:google-services:4.3.15'
    }
}

2.3 Update `android/app/build.gradle`

  • Add the following line at the bottom of the file:
  • apply plugin: 'com.google.gms.google-services'
  • Add the Firebase messaging dependency in the dependencies section:
  • implementation 'com.google.firebase:firebase-messaging:24.2.0'

2.4 Update `AndroidManifest.xml`

  • Add the necessary permissions and service declarations inside the <application> tag:
  • <uses-permission android:name="android.permission.INTERNET"/>
    <uses-permission android:name="android.permission.RECEIVE_BOOT_COMPLETED"/>
    <uses-permission android:name="android.permission.WAKE_LOCK"/>
    
    <application ...>
        <service
            android:name=".MyFirebaseMessagingService"
            android:exported="true"
            android:permission="android.permission.BIND_JOB_SERVICE">
            <intent-filter>
                <action android:name="com.google.firebase.MESSAGING_EVENT"/>
            </intent-filter>
        </service>
    </application>

3. Configure iOS for Firebase


3.1 Add Firebase SDK to Your iOS Project

  • Download the GoogleService-Info.plist file from the Firebase Console.
  • Place the GoogleService-Info.plist file in the ios/Runner directory of your Flutter project.

3.2 Install CocoaPods Dependencies

cd ios
pod install

3.3 Update `Podfile`

platform :ios, '10.0'
use_frameworks!

3.4 Update `AppDelegate.swift`

  • Import the required modules and configure Firebase:
  • import UIKit
    import Flutter
    import FirebaseCore
    import FirebaseMessaging
    
    @UIApplicationMain
    @objc class AppDelegate: FlutterAppDelegate {
        override func application(
            _ application: UIApplication,
            didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
        ) -> Bool {
            FirebaseApp.configure()
            Messaging.messaging().delegate = self
            return super.application(application, didFinishLaunchingWithOptions: launchOptions)
        }
    
        override func application(
            _ application: UIApplication,
            didReceiveRemoteNotification userInfo: [String: Any],
            fetchCompletionHandler completionHandler: @escaping (UIBackgroundFetchResult) -> Void
        ) {
            Messaging.messaging().appDidReceiveMessage(userInfo)
            super.application(application, didReceiveRemoteNotification: userInfo, fetchCompletionHandler: completionHandler)
        }
    }

3.5 Request Notification Permissions

import UserNotifications

func application(_ application: UIApplication,
                 didRegisterForRemoteNotificationsWithDeviceToken deviceToken: Data) {
    Messaging.messaging().apnsToken = deviceToken
}

func application(_ application: UIApplication,
                 didFailToRegisterForRemoteNotificationsWithError error: Error) {
    print("Failed to register: \(error)")
}

func application(_ application: UIApplication,
                 didReceive notification: UILocalNotification) {
    print("Notification received: \(notification)")
}

4. Configure Flutter App

4.1 Add FlutterFire Plugins

dependencies:
      flutter:
        sdk: flutter
      firebase_core: ^2.10.0
      firebase_messaging: ^14.0.0

4.2 Initialize Firebase in Your Flutter App

import 'package:firebase_core/firebase_core.dart';
import 'package:firebase_messaging/firebase_messaging.dart';
import 'package:flutter/material.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter App',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State {
  @override
  void initState() {
    super.initState();
    FirebaseMessaging.onMessage.listen((RemoteMessage message) {
      print('Message received: ${message.messageId}');
      // Handle foreground messages here
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('FCM Demo'),
      ),
      body: Center(
        child: Text('Hello World'),
      ),
    );
  }
}

5. Testing Your Configuration

  • Android: Use the Firebase Console to send test messages or use the firebase_messaging package to test messages locally.
  • iOS: Ensure you have a real device or use the simulator to test push notifications, as push notifications don't work on iOS simulators.

Following these steps will help you successfully configure Firebase Cloud Messaging (FCM) for your Flutter mobile app on both Android and iOS platforms.

Firebase CLI Quick Setup 2.5

Firebase CLI Quick Setup instruction

Step 1: Create a Firebase Project

  • Open Firebase Console: Create a new project by visiting the following link: Firebase Console.
  • Access Your Project: After creating the Firebase project, open it and click on the Flutter logo. Follow the provided setup steps.

    Important Note: Before configuring Firebase, ensure you change the package name for Android and the bundle identifier for iOS in your app.

Installation

  • Install Firebase CLI (requires Node.js):
    npm install -g firebase-tools
  • Install FlutterFire CLI:
    dart pub global activate flutterfire_cli

Usage

Initialize Firebase

  • Run the Configuration Command: In the root of your Flutter application, execute:
    flutterfire configure
  • Follow the Prompts:
    • Choose your Firebase project.
    • Select the platforms (Android, iOS, web, etc.).
    • The CLI generates a firebase_options.dart file in your project.

Import and Initialize in Your App

In your lib/main.dart, add:

import 'firebase_options.dart';

// Initialize Firebase
await Firebase.initializeApp(
  options: DefaultFirebaseOptions.currentPlatform,
);

Note

If you add new platforms or Firebase services, rerun:

flutterfire configure

Web and Admin

Vue.js Website 3.1

Running the Vue.js Alicom Website

This documentation provides a step-by-step guide to running the Vue.js-based Alicom website. Follow these instructions to set up your development environment and run the website locally.

1. Prerequisites

  • Node.js installed (version 12.x or higher).
  • npm or Yarn package manager installed.
  • Vue CLI installed (optional but recommended for easier setup).

2. Setup Project

Start by setting up the project:

cd path-to-your-ready-ecommerce-project

3. Install Dependencies

Once inside the project directory, install the necessary dependencies:

  • If using npm:
  • npm install
  • If using Yarn:
  • yarn install

4. Running the Development Server

To start the development server and view the website in your browser, run:

  • If using npm:
  • npm run serve
  • If using Yarn:
  • yarn serve

The website will be available at http://localhost:8080 (or another port if specified). Open this URL in your browser to view the site.

5. Building for Production

To create a production build of your website, use the following command:

  • If using npm:
  • npm run build
  • If using Yarn:
  • yarn build

This command will create a dist/ directory containing the optimized files for production deployment.

6. Troubleshooting

If you encounter issues while running or building the website, consider the following troubleshooting steps:

  • Check Node.js Version: Ensure you are using a compatible version of Node.js. You can check your Node.js version by running node -v.
  • Clear Cache: Sometimes clearing the npm or Yarn cache can resolve issues. Use npm cache clean --force or yarn cache clean.
  • Delete Node Modules: Remove the node_modules directory and reinstall dependencies:
  • rm -rf node_modules
    					npm install
  • Check Configuration: Verify your configuration files (e.g., vue.config.js, package.json) for any misconfigurations.
  • Consult Logs: Review the error messages in your terminal or browser console for clues on what might be going wrong.

7. Conclusion

By following these steps, you should be able to run your Vue.js Alicom website locally and prepare it for production. If you encounter issues, refer to the troubleshooting section or consult the Vue.js documentation for additional guidance.

-->

Admin Panel 3.2

Running Laravel Admin Panel for Alicom

This documentation provides a step-by-step guide to running a Laravel-based admin panel for a Alicom. Follow these instructions to set up your development environment and run the admin panel locally.

1. Prerequisites

  • PHP installed (version 8.1 or higher).
  • Composer package manager installed.
  • Laravel installed globally (optional but recommended).
  • A MySQL or PostgreSQL database server running.
  • Node.js and npm installed (for managing frontend dependencies and ..).

Follow This Instructions

  1. Zip your project folder.
  2. Login to your cPanel.
  3. Go to the File Manager option and select it.
  4. Ensure you're in the root folder, then click "Upload".
  5. Select your zip folder and wait for the upload to complete. If the upload area is green, then go back to home.
  6. Unzip the uploaded folder.
  7. Selectall files and directory move to the root folder.
  8. Go back to Cpanel and navigate to Database.
  9. Created a database and add (create if non exist) a DB user.
  10. Example

    Example-01 Example-01 Example-01
  11. You can then run your domain in any browser after that
  12. Press the Start Installation Process button that appears on the screen
  13. Then go to the root folder to check permission and give permission to the mentioned folders
  14. After that, if the permissions of the files are all right, then press the Next button
  15. After that, if the server request extensions are enabled, then click on the next button. If any extension is shown as disabled, then go to select PHP version from the C panel and enable all the extensions that are shown as disabled, then refresh the browser and then click on the next button.
  16. Then fill up the written forms and press the next button
  17. Example

    Example-01
  18. Connect to the database you created and press the next button
  19. Example

    Example-01
  20. Then fill out the form using your Email Account, Domain, Codecanyon Username, and your Purchase Code, and click the Verify Purchases button.
  21. Example

    Example-01
  22. Click on the Final Submission button and complete the installation process by clicking on the Click to Redirect button.

Full Installation Journey Example

Example-01 Example-01 Example-01 Example-01 Example-01 Example-01 Example-01 Example-01 Example-01 Example-01 Example-01 Example-01 Example-01 Example-01 Example-01 Example-01 Example-01 Example-01 Example-01 Example-01 Example-01 Example-01

Navigate into the project directory:

cd your-music-admin-panel

2. Install Dependencies

Once inside the project directory, install the necessary PHP and frontend dependencies:

  • Install PHP dependencies using Composer:
  • composer install
  • Install frontend dependencies using npm:
  • npm install

3. Configure Environment Variables

Copy the example environment file to create your local environment configuration:

cp .env.example .env

Edit the .env file to set up your database connection and other environment-specific settings:

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=your_database
DB_USERNAME=your_username
DB_PASSWORD=your_password

4. Generate Application Key

Generate a new application key for Laravel:

php artisan key:generate

5. Run Database Migrations

Run database migrations to set up your database schema:

php artisan migrate

6. Seed the Database (Optional)

If you have seed data, you can populate your database with initial data:

php artisan db:seed

7. Run the Development Server

Start the Laravel development server:

php artisan serve

The admin panel will be available at http://localhost:8000. Open this URL in your browser to view the admin panel.

8. Compile Frontend ..

Compile your frontend .. for development:

npm run dev

For production builds, use:

npm run build

9. Troubleshooting

If you encounter issues while running the admin panel, consider the following troubleshooting steps:

  • Check PHP Version: Ensure you are using a compatible version of PHP. Check your PHP version with php -v.
  • Check Dependencies: Ensure that all PHP and frontend dependencies are installed correctly. Use composer install and npm install to reinstall.
  • Verify Database Configuration: Ensure that your .env file has the correct database credentials and that the database server is running.
  • Clear Caches: Sometimes clearing application caches can resolve issues:
  • php artisan cache:clear
    php artisan config:clear
    php artisan view:clear
  • Check Logs: Review the error messages in your terminal or log files (storage/logs/) for more information on what might be going wrong.

10. Conclusion

By following these steps, you should be able to run the Laravel-based admin panel for your Alicom locally. If you encounter issues, refer to the troubleshooting section or consult the Laravel documentation for additional guidance.

Install on localhost 3.3

To install on localhost,and follow the installation prompts for seamless setup.

Follow This Instructions.

If you use windows operating system
  1. Download and install XAMPP in C drive.
  2. Start Your Xampp Server.
  3. Download and Install Composer in C drive.
  4. Unzip the downloaded archive package.
  5. Move the unzipped file to your htdocs folder.
  6. Creating Database
    • Point your browser to phpMyAdmin address by typing http://localhost/phpmyadmin .
    • In phpMyAdmin, click on Databases tab.
    • Enter the name of new database that you want created.
    • you may also need to select the collation for the database. Please select the collation match your language. If you do not know what to select, you can select utf8_general_ci or leave default (Collation).
    • Click Create button.
Example
Example-01
Configuration

Please copy the .env.example and rename it to .env and fill up the .env

  • APP_NAME = (Youe App Name)
  • APP_ENV = (Local Production)
  • APP_URL = (https:// Your Domain Link..)
  • DB_DATABASE = (Your Database Name)
  • DB_USERNAME = (Your Database Username)
  • DB_PASSWORD = (Your Database Password)
  • MAIL_MAILER = (SMTP Email Relay Services)
  • MAIL_HOST = Your Mail Host(For Example: smtp.gmail.com)
  • MAIL_PORT = Your Mail Port(For Example: 587)
  • MAIL_USERNAME = (Your Mail Username)
  • MAIL_PASSWORD = (Your Mail Password)
  • MAIL_ENCRYPTION = (SSL, TLS)
  • MAIL_FROM_ADDRESS = (For Example: no-reply@gmail.com)

You need to fill the database connection details, administration details, and store details to .env example file.

Run Installation Command
  • Open terminal/windows powershell and go to project folder directory
  • If a terminal exists On your cpanel
  • Open your terminal and go to root directory for example (cd public_html/)
  1. composer install
  2. php artisan migrate:fresh --seed
  3. php artisan storage:link
  4. php artisan serve

Run Project
  • Open you browser
  • browse http://127.0.0.1:8000 Or http://localhost:8000
  • This instruction shows how to run it locally on your PC, but it works generally the same on any hosting portals. In most case in payed portals you have any web panels to configure your public folder that reference to /public folder in laravel folder's structure.

COMPLETE

You'll see a success message after successfully following the above steps. You now have the option to browse your application through respected domain or IP.