/home/bdqbpbxa/demo-subdomains/ping-proxies.goodface.com.ua/README.md
# Getting Started with Create React App and Redux
This project was bootstrapped with Create React App, using the Redux and Redux Toolkit template.
## Used Libraries
- **@gsap/react**: GSAP animations for React
- **@mui/material**: Material-UI components
- **@reduxjs/toolkit**: Redux Toolkit for state management
- **@strapi/blocks-react-renderer**: Render blocks from Strapi
- **axios**: For making HTTP requests
- **dayjs**: For working with dates and date-pickers
- **jszip**: Library for creating, reading, and editing .zip files
- **react-cookie**: For managing cookies in React
- **react-ga4**: Google Analytics 4 for React
- **react-helmet**: Manage document head
- **react-lazy-load-image-component**: Lazy loading for images
- **react-redux**: Official React bindings for Redux
- **react-router-dom**: Declarative routing for React
- **react-table**: Hooks for building fast and extendable tables
- **react-transition-group**: Animations for React components
- **sass**: CSS preprocessor
## Available Scripts
In the project directory, you can run:
### `npm start`
Runs the app in the development mode.
Open [http://localhost:3000](http://localhost:3000) to view it in your browser.
The page will reload when you make changes.
You may also see any lint errors in the console.
### `npm run build`
Builds the app for production to the `build` folder.
## Project Structure
```plaintext
PingProxies_FE/
├── build/ # Compiled files for production
├── node_modules/ # Project dependencies
├── public/ # Static files and assets
├── src/ # Main source code directory
│ ├── Layout/ # Layout components
│ │ ├── ColumWraper/ # Column layout component
│ │ ├── Footer/ # Footer component
│ │ ├── Header/ # Header component
│ │ ├── LegalPages/ # Components for legal pages
│ │ ├── Preloader/ # Preloader component
│ │ ├── infoLayout/ # Layout for informational pages
│ │ ├── Layout.jsx # Main layout component
│ │ ├── mockData.js # Mock data for layout
│ │ └── styles.scss # Layout-specific styles
│ ├── api/ # API service modules
│ │ ├── AboutUs/ # API calls for About Us page
│ │ ├── Blog/ # API calls for Blog page
│ │ ├── Contact/ # API calls for Contact page
│ │ ├── FAQ/ # API calls for FAQ page
│ │ ├── Features/ # API calls for Features page
│ │ ├── General/ # General API calls
│ │ ├── Homepage/ # API calls for Homepage
│ │ ├── LandingPage/ # API calls for Landing Page
│ │ ├── LegalInfo/ # API calls for Legal Information
│ │ ├── LocationPage/ # API calls for Location Page
│ │ ├── Pricing/ # API calls for Pricing page
│ │ ├── Product/ # API calls for Product page
│ │ ├── constants.js # API-related constants
│ │ ├── helpers.js # Helper functions for API
│ │ └── urls-config.json # Configuration for API URLs
│ ├── assets/ # Static assets like images and icons
│ │ ├── backgrounds/ # Background images
│ │ ├── cuts/ # Cut images
│ │ ├── flags/ # Flag icons
│ │ ├── icons/ # Various icons
│ │ ├── images/ # General images
│ │ ├── logo.svg # Logo file
│ │ ├── map.svg # Map image
│ │ └── world-map.svg # World map image
│ ├── components/ # Reusable components
│ │ ├── AnimationIllustrations/ # Components for animated illustrations
│ │ ├── AskExpert/ # Ask Expert component
│ │ ├── ContactForm/ # Contact form component
│ │ ├── Label/ # Label component
│ │ ├── Logo/ # Logo component
│ │ ├── Popups/ # Popup components
│ │ ├── PricingTable/ # Pricing table component
│ │ ├── ProductCard/ # Product card component
│ │ ├── Sections/ # Section components
│ │ ├── SingleBody/ # Single body component
│ │ ├── Table/ # Table component
│ │ ├── Tag/ # Tag component
│ │ ├── TrastLogo/ # Trust logo component
│ │ ├── TrastpilotStars/ # Trustpilot stars component
│ │ └── common/ # Common reusable components
│ ├── constants/ # Application constants
│ │ ├── routes.js # Route constants
│ │ └── sitemapRoutes.js # Sitemap route constants
│ ├── fonts/ # Font files
│ │ ├── SourceCodePro-Bold.woff2 # Source Code Pro Bold font
│ │ ├── SpaceGrotesk-Bold.woff2 # Space Grotesk Bold font
│ │ ├── SpaceGrotesk-Light.woff2 # Space Grotesk Light font
│ │ ├── SpaceGrotesk-Medium.woff2 # Space Grotesk Medium font
│ │ ├── SpaceGrotesk-Regular.woff2 # Space Grotesk Regular font
│ │ ├── SpaceGrotesk-SemiBold.woff2 # Space Grotesk SemiBold font
│ │ └── font.scss # Font styles
│ ├── hooks/ # Custom React hooks
│ │ ├── scrollToTop.jsx # Hook to scroll to top
│ │ ├── useAnalyticsEventTracker.jsx # Hook for Google Analytics event tracking
│ │ ├── useAnimation.jsx # Hook for animations
│ │ ├── useImageLoaded.jsx # Hook to check if images is loaded
│ │ ├── useMediaQuery.jsx # Hook for media queries
│ │ └── useTimeout.jsx # Hook for timeout
│ ├── pages/ # Application pages
│ │ ├── 404/ # 404 Not Found page
│ │ ├── AboutUs/ # About Us page
│ │ ├── Blog/ # Blog page
│ │ ├── BrandAssets/ # Brand Assets page
│ │ ├── Contacts/ # Contacts page
│ │ ├── FAQ/ # FAQ page
│ │ ├── Features/ # Features page
│ │ ├── Home/ # Home page
│ │ ├── LandingPage/ # Landing page
│ │ ├── Pricing/ # Pricing page
│ │ ├── PrivacyPolicy/ # Privacy Policy page
│ │ ├── Product/ # Product page
│ │ ├── ProxyLocations/ # Proxy Locations page
│ │ ├── RefundPolicy/ # Refund Policy page
│ │ ├── Resources/ # Resources page
│ │ ├── Sitemap/ # Sitemap page
│ │ ├── TermsAndConditions/ # Terms and Conditions page
│ │ └── UIKit/ # UIKit page
│ ├── store/ # Redux store configuration
│ │ ├── slices/ # Redux slices
│ │ └── index.js # Store setup
│ ├── styles/ # Global styles
│ │ ├── .idea/ # IDE settings
│ │ ├── _mixins.scss # SCSS mixins
│ │ ├── _typography.scss # Typography styles
│ │ ├── _variables.scss # SCSS variables
│ │ ├── containers.scss # Container styles
│ │ ├── main.scss # Main stylesheet
│ │ └── reset.scss # CSS reset
│ ├── App.jsx # Main App component
│ ├── helpers.js # Helper functions
│ └── index.js # Entry point of the application
├── .gitignore # Git ignore configuration
├── .htaccess # Apache server configuration file
├── .prettierrc # Prettier configuration
├── README.md # Project documentation
├── jsconfig.json # JavaScript configuration file
├── package-lock.json # Lock file for npm dependencies
└── package.json # npm package configuration
```