Skip to main content

​
Installation Guide

This guide will walk you through setting up the Bİ DOLU İÇECEK application on your local development environment.

​
Prerequisites

Before you begin, ensure you have the following installed on your system:
The application requires Node.js to run the development server and build the production bundle.

​
Required Software

  • Node.js: Version 14.x or higher recommended
  • npm: Comes bundled with Node.js (version 6.x or higher)
  • Git: For cloning the repository

​
Verify Installation

Check your Node.js and npm versions: 
node --version
npm --version

​
Installation Steps

1

Clone the Repository

Clone the project repository to your local machine:
git clone [repo-url]
cd suapp
Replace [repo-url] with the actual repository URL provided by your team.
2

Install Dependencies

Install all required npm packages:
npm install
This will install the following key dependencies:Core Dependencies:Styling:Configuration:Testing:
3

Environment Configuration (Optional)

The application uses Edge Config for dynamic configuration management. If you need to set up Edge Config:Create a .env file in the root directory:
touch .env
Add your Edge Config connection string:
EDGE_CONFIG=your-edge-config-connection-string
Edge Config is optional. The application will use default configurations from src/config/ files if Edge Config is not available.

​
Configuration Files

The following configuration files can be customized:
  • src/config/serviceHours.js - Service hours settings
  • src/config/whatsapp.js - WhatsApp phone number and messages
  • src/config/orderLimits.js - Minimum/maximum order amounts
  • src/config/damacanaLimits.js - Damacana ordering time restrictions
  • src/config/language.js - Multi-language support
4

Add Product Images (Optional)

The application supports custom product images. To add images:Create the images directory:
mkdir -p public/images
Add your product images to public/images/ directory. The application expects:
  • logo.png - Company logo (150-250px width, 40-60px height)
  • Product images referenced in src/data/products.js
  • Video files in public/videos/ (optional)
If images are not found, the application will display emoji placeholders defined in the products data.
5

Verify Installation

Verify that the installation was successful by checking the project structure:
ls -la
You should see:
  • node_modules/ - Installed dependencies
  • package.json - Project configuration
  • src/ - Source code directory
  • public/ - Static assets
  • tailwind.config.js - Tailwind CSS configuration (if present)

​
Project Structure

After installation, your project structure should look like this: 
suapp/
├── node_modules/          # Installed dependencies
├── public/                # Static assets
│   ├── images/           # Product images and logo
│   ├── videos/           # Video content (optional)
│   └── index.html        # HTML template
├── src/                  # Source code
│   ├── components/       # React components
│   ├── config/          # Configuration files
│   │   ├── serviceHours.js
│   │   ├── whatsapp.js
│   │   ├── orderLimits.js
│   │   └── damacanaLimits.js
│   ├── context/         # React context (CartContext)
│   ├── data/            # Static data
│   │   ├── products.js  # Product catalog
│   │   └── socialMedia.js
│   ├── App.js           # Main application component
│   ├── App.css          # Application styles
│   └── index.js         # Application entry point
├── package.json         # Project dependencies
└── README.md           # Project documentation

​
Common Installation Issues

​
Node Version Mismatch

If you encounter errors during installation, ensure you’re using a compatible Node.js version: 
node --version  # Should be 14.x or higher
Consider using nvm to manage Node.js versions.

​
Permission Errors

If you get permission errors during npm install: 
# Don't use sudo - instead fix npm permissions
npm config set prefix ~/.npm-global
export PATH=~/.npm-global/bin:$PATH

​
Cache Issues

If installation fails, try clearing the npm cache: 
npm cache clean --force
rm -rf node_modules package-lock.json
npm install

​
Next Steps

Now that you have installed the application, proceed to the Quick Start guide to run the development server:

Quick Start Guide

Learn how to run the development server and explore the application features

Build docs developers (and LLMs) love

Get started for freeTalk to us