Squidex
  • Welcome to Squidex
  • Getting Started
    • Squidex Cloud
    • Installation Instructions
      • Platforms
        • Install on Kubernetes
        • Install on AWS (Deprecated)
        • Install on AWS EC2 using Docker
        • Install on Azure
        • Install on Azure using ARM
        • Install on Google Cloud Platform (GCP)
        • Install on Docker
        • Install on Heroku
        • Install on IIS
        • Install on Render
        • Install on Vultr
      • Configuration
        • Deploying the Image Resizer Service
      • Troubleshooting and Support
        • Diagnose Runtime Issues
        • Restoring Deleted Apps
      • Install Identity (Deprecated)
      • External Identity Providers
        • Azure AD (OAuth) with Squidex
    • Contributing and Developing
      • Building
      • Developing
      • Extensions
        • Custom Rule Action
      • Contributing
      • Architecture
      • Translating
      • Squidex Docs Program
    • Roadmap
    • Quick Start Guides
      • Vue.js Blog with Squidex
      • React.js Blog with Squidex
      • Angular Blog with Squidex
  • Documentation
    • Introduction and Use Case
    • Concepts
      • Apps
      • Teams
      • Schemas
        • Field Rules
      • Content
        • Scheduled Publishing
      • Assets
        • Querying Assets
      • Localization
      • Migrations
      • Roles & Permissions
      • Rules
        • Publish an Event to Azure Queues using Rules
        • Populate Elasticsearch Index
      • Backups
      • Subscriptions
        • App Subscriptions v/s Team Subscriptions
      • Notifications
      • Dashboard
      • Workflows
    • Software Development Kits
      • TypeScript
      • .NET
        • Version v14 (and Earlier)
        • Version v15 (and Later)
      • PHP
      • Java
    • Developer Guides
      • API
        • Authentication
        • Postman
        • Queries
        • Assets
      • Automation Tools (CLI)
      • Scripting
        • Scripting Helper Methods
      • Embed Content
      • Custom Workflows
      • Custom Editors
      • Custom Sidebars
      • Preview Content
      • Rule Formatting
        • Simple
        • Script
        • Liquid
      • Tutorials
        • Building a Blog with Squidex and Next.js
  • Next
    • Squidex 3.0: API Compatibility
Powered by GitBook
On this page
  • Required Tools
  • Docker
  • For the Backend
  • For the Frontend
  • IDEs and Editors
  • How to Run Squidex
  • Frontend
  • Backend

Was this helpful?

  1. Getting Started
  2. Contributing and Developing

Developing

An Introduction on Setting Up Your Development Environment (this step is required if you want to contribute to Squidex or write customized extensions for it)

PreviousBuildingNextExtensions

Last updated 2 years ago

Was this helpful?

You can find the source code on GitHub:

Required Tools

To work with the source code you need the following tools.

Docker

We recommend using Docker on your developer machine, it makes life much easier!

Note, we weren't able to run newer versions of Docker on Windows 10 Home. If you don't have a Windows 10 PRO license, we recommend not wasting your money. Get a cheap build server for a few bucks per month instead, or just install MongoDB manually. It only takes around 15 minutes to install.

For the Backend

  • (for version <= 6.1)

  • or (for older versions of Squidex)

  • Optionally:

  • Optionally:

Setup

Execute the following commands to get a MongoDB installation for development.

git clone https://github.com/squidex/squidex-docker
cd squidex-docker/development
docker-compose up -d

For the Frontend

Usually, newer versions are better, but the newer versions of NodeJS are renowned for consuming a lot of memory during a build or when running Webpack Dev Server.

IDEs and Editors

You can use any editor you want, but our recommendation is to use:

How to Run Squidex

To run Squidex, you must run both frontend and backend independently. This might feel redundant and annoying at first (we also had to use some code to run the the Webpack Dev Server automatically when the application started), but it only takes a minute for the Webpack Dev Server to begin. We have decoupled the commands so you can keep the Webpack Dev Server running, even when you have to restart the backend application.

Before you start, ensure that the certificates for the test environment are installed. They can be found under /dev in the Squidex folder.

Frontend

How to run the Webpack Dev Server?

cd frontend # Go to the frontend
npm i # Install all dependencies, only needed the first time
npm start

Installing the dependencies is only needed once or when the project.json file has changed.

Optionally:

  1. npm rebuild node-sass --force (Only if you have issues with node-sass)

  2. npm test (Runs the unit tests and listens for changes)

  3. npm run test:coverage (Runs the unit tests and calculates the test coverage).

As the name Webpack Dev Server indicates, it's only used for development. For production we bundle and minimise all typescript, html and sass files and add the bundles to the deployment package. During development, the frontend downloads hundreds of files, this is a completely normal process.

Backend

cd backend
cd src/Squidex
dotnet restore # Install all dependencies
dotnet run

Ensure that the ASPNETCORE_ENVIRONMENT environment variable is set to Development, either through the launchSettings.json file or through your IDE's settings.

You can also run and debug the backend with Visual Studio 2019. Here are some recommended steps you should undertake before starting your debug session:

  1. Ensure that you run the Squidex project, which means that you use the integrated Kestrel web server (this begins faster than IIS Express).

  2. Uncheck the Launch browser setting. You just want to keep Squidex open during development (and not constantly close and open the window) to make debugging the frontend with your browser easier.

You'll find ready to use Docker configurations for development at .

(>= 10.0)

OR for the backend.

for the frontend with the following plugins installed:

(to run linting for typescript).

(to run linting for scss / css).

.

The frontend is written with and . Therefore you have to run the . It's a server application that builds the website and watches the file system. Whenever you make a change to a file, the server runs the build process and reloads the website automatically. It only tries to compile the files that have changed and in some cases, can even reload the style sheets without reloading the site.

Open to run Squidex.

https://github.com/squidex/squidex
Docker Desktop for Windows
Docker Desktop for Mac
Docker Desktop for Linux
.NET 6 SDK
.NET 5 SDK
.NET Core 2.2 SDK
.NET Core 3.0 SDK
MongoDB
RabbitMQ
EventStore
https://github.com/squidex/squidex-docker
NodeJS
Visual Studio 2022 Community Edition
Visual Studio 2019 Community Edition
Visual Studio Code
ESLint
Stylelint
Angular Language Service
Angular
webpack
webpack web dev server
https://localhost:5001