Directory Structure and Organization

This outline details the directory structure and organization of the project, providing context for understanding the layout of key folders, including edge-apps, bootstrap, dynamic-playlists, instagram, and javascript-injectors.

Root Directory

• .eslintrc.js: This file configures the ESLint linter for the project.
• package.json: Defines the project’s dependencies, scripts, and metadata.
• README.md: Provides a description of the project and instructions for setup and use.
• tsconfig.json: Specifies the TypeScript compiler configuration for the project.
• webpack.config.js: Configures the Webpack build process.

edge-apps Directory

• src: Contains the source code for the edge apps, including:
  • edge-app-template: Serves as a template for creating new edge apps.
  • media-player: Provides media playback functionality.
  • screenly-app-template: Serves as a template for creating new Screenly apps.
  • screenly-app-template-v2: An updated version of the screenly-app-template for creating new Screenly apps.
• test: Contains unit tests for the edge apps.

bootstrap Directory

• src: Contains the source code for the Bootstrap component library, including:
  • components: Houses various UI components for the application.
  • core: Provides core functionality and utilities.
  • utils: Offers utility functions and helpers.

dynamic-playlists Directory

• src: Contains the source code for the dynamic playlists feature, including:
  • components: Provides components for the dynamic playlists UI.
  • constants: Defines constants used throughout the dynamic playlists module.
  • containers: Manages the state and logic for dynamic playlists.
  • models: Defines data models for dynamic playlists.
  • selectors: Implements selectors for accessing dynamic playlist data from the Redux store.
• test: Contains unit tests for the dynamic playlists feature.

instagram Directory

• src: Contains the source code for the Instagram integration, including:
  • components: Provides UI components for interacting with Instagram.
  • constants: Defines constants used by the Instagram integration.
  • containers: Manages the state and logic for the Instagram integration.
  • models: Defines data models for Instagram objects.
  • utils: Provides utility functions for interacting with the Instagram API.

javascript-injectors Directory

• src: Contains the source code for the JavaScript injectors, including:
  • injectors: Defines various JavaScript injectors for different use cases.
  • utils: Provides utility functions for the JavaScript injectors.

web Directory

• src: Contains the source code for the web application, including:
  • components: Houses UI components for the web application.
  • containers: Manages the state and logic for the web application.
  • styles: Provides styles for the web application.
  • utils: Offers utility functions and helpers for the web application.
• test: Contains unit tests for the web application.

scripts Directory

• create-bootstrap-component.js: A script for creating new Bootstrap components.
• create-screenly-app.js: A script for creating new Screenly apps.
• index.js: The entry point for the application.
• setup-playground.js: A script for setting up the playground environment.

examples Directory

• edge-app: Contains example edge apps, including:
  • edge-app-template: A template for creating new edge apps.
• screenly-app: Contains example Screenly apps, including:
  • screenly-app-template: A template for creating new Screenly apps.
• screenly-app-template-v2: An updated version of the screenly-app-template for creating new Screenly apps.
• dynamic-playlists: Contains examples of dynamic playlists.

config Directory

• default.js: Defines default configuration settings for the project.
• development.js: Defines configuration settings for development mode.
• production.js: Defines configuration settings for production mode.

mock Directory

• media-player: Contains mock data for the media player.

types Directory

• index.d.ts: Defines global type definitions for the project.

assets Directory

• public: Contains public assets for the project, including:
  • images: Contains images for the project.
  • sounds: Contains audio files for the project.
  • videos: Contains video files for the project.
• styles: Contains stylesheets for the project, including:
  • index.scss: The main stylesheet for the project.
• scripts: Contains JavaScript files for the project, including:
  • index.js: The main JavaScript file for the project.