# Sygnal Site Engine ( SSE2 )

**Sygnal Site Engine ( SSE )** is a framework for *client-side* script development in Webflow-hosted sites. It combines a range of best-practices and modern technologies to create an ideal development environment for Webflow.

{% hint style="success" %}
**SSE v2.0.0 Released!** We've released a major update with new base classes, automatic Webflow context detection, and improved lifecycle methods. See [What's New](/whats-new.md) for details.
{% endhint %}

We focus on using...

* Modern development IDEs such as VS Code or Cursor
* Modern languages, specifically TypeScript and SASS
* Structured development practices- multiple classes and files to organize your code
* Source control to protect your code and history
* Development, test, and production environment separation
* CI/CD pipeline support to deploy your code changes
* Monorepo- a consolidated codebase approach for your Webflow client-side development to ensure smooth integration into your Webflow site
* Switchable debugging- turn on console logging centrally, and only when you need it

{% hint style="success" %}
**Zero Cost.** A complete setup can be built 100% free, as all of these technologies are freely available or utilize free plans. All it requires is learning the tech, and the setup.
{% endhint %}

## Core Technologies Used

SSE's architecture is highly flexible, but this is our typical configuration;

* **TypeScript** for structured, modern code development with type-safety. Makes code far more manageable, more reusable, better bug-proofing, and offers better testing.
* **SASS** for modern structured CSS development which support robust commenting
* **GitHub** for full source control management ( SCM ), ensures your code is safe, and that you have a full history of changes.
* **Jest** for full unit-testing support
* **VSCode** as a full modern IDE for development
* **Netlify** for the production code-delivery CDN.
* **Sygnal DevProxy** for full DEV/TEST and PROD environments. Allows your developers, team, and clients to fully test new features before they are public.

## Key Benefits

This setup gives us a ton of benefits;

* Easy code management in your Webflow site. There is no code editing anywhere, on any pages through the Webflow designer. Everything is done directly in VS code.
* Monorepo for code safety- there is no risk of breaking your site or deleting important pieces, everything is safe in GitHub and you can revert any time.
* Solid versioning, tracking, and production deployment controls.
* Realtime development. Change, save, refresh, you're looking at live code against your current Webflow staged site.
* Persistent testing. Check in code anytime, and your client and testing team can review the latest changes immediately on e.g. `test.mysite.com` or whatever URL or subdomain you choose.
* Easy access to add-on libraries, like Luxon for dates, cookie.js for cookie management, or GSAP for animation.
* CI/CD setup for easy, live deployment support. There is no need to change code or URLs in Webflow, you can deploy your code updates to your production site through a simple GitHub pull request.

{% hint style="success" %}
We're continually adding new features as well, because our team utilizes this setup in all of our client sites.
{% endhint %}

## Video Tour

Here's a quick video overview of how SSE benefits our team and projects.

{% embed url="<https://www.loom.com/share/a65258f54d424511a1a1373428723922>" %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://engine.sygnal.com/readme.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.