Altinn Studio is the next generation Altinn application development solution. Together with Altinn Apps and Altinn Platform, this is a complete application development and hosting platform (Altinn 3).
Read the Altinn Studio documentation to get started. We've also created a introductory course for app development that you can follow at your own pace.
Note Developing apps? If you just want to quickly perform tests of your app on your development machine you can follow the instructions on how to run apps locally. This repository is mainly the Designer-tool which is used to build and deploy apps.
These instructions will get you a copy of the project up and running on your local machine for development and testing purposes. See deployment for notes on how to deploy the project on a live system.
- Newest .NET 6 SDK
- Node.js (version 16.*)
- Newest Git
- A code editor - we like Visual Studio Code
- Also install recommended extensions (f.ex. C#)
- Docker Desktop
- If you are running Docker Desktop in Hyper-V mode you need to make sure your C drive is shared with Docker, Docker Settings -> Shared Drives The File sharing tab is only available in Hyper-V mode, because in WSL 2 mode and Windows container mode all files are automatically shared by Windows.
- World Wide Web Publishing Service must be disabled, Services -> "World Wide Web Publishing Service" right click and choose "stop"
NOTE: If you want to use Safari on MacOS add 127.0.0.1 studio.localhost to /private/etc/hosts
Clone the Altinn Studio repo and navigate to the folder.
git clone https://github.com/Altinn/altinn-studio
cd altinn-studioThe fastest way to get things running from scratch is to use our setup-script. This script will start docker and ensure that the setup is up to date. As we add more features this script will be updated. It can be run as follows:
yarn && yarn setupMore about that script and development in general, can be found here.
The development environment consist of several services defined in compose.yaml.
studio-loadbalancerwhich is a simple nginx-container usingnginx:alpinedirectly, just used for development.studio-designerwhich is the actual build artifact with the .NET backend and the react-apps.studio-reposwhich is gitea with some custom config. More here.studio-dbwhich is a postgres database used by bothstudio-designerandstudio-repos.
Run all parts of the solution in containers (Make sure docker is running), with docker compose as follows:
docker-compose up -d --buildThe solution is now available locally at studio.localhost. (Just create a new user for testing. No email verification required). If you make changes and want to rebuild a specific project using docker-compose this can be done using
docker-compose up -d --build <container>Example
docker-compose up -d --build studio_designerIf using the script, the .env-file is generated and put at root, otherwise you will need to place it there yourself.
When starting docker-compose the solution should be running as it would in production. But you probably want to change
parts of the solution. The load balancer is configured to route the traffic to the right place according to your
particular use case. This is done by placing a .env-file in the same folder as compose.yaml. The load balancer
is configured with the following variables.
DEVELOP_BACKEND=0
DEVELOP_DASHBOARD=0
DEVELOP_APP_DEVELOPMENT=0
DEVELOP_STUDIO_ROOT=0
Navigate to the designer backend folder cd backend/src/Designer. The first time running, or after any package changes,
get the latest packages.
- On MacOS you need one extra step before running .NET:
Change location where the application stores the DataProtectionKeys
export ALTINN_KEYS_DIRECTORY=/Users/<yourname>/studio/keys
If you want to work on creating apps locally, the app-template-dotnet repo
should be cloned. If the templates repo is cloned in the same folder as altinn-studio, no changes needs to be done,
otherwise it should be referenced in appsettings.development.json.
{
"GeneralSettings": {
"TemplateLocation": "Path to src folder of app-template-dotnet repo",
"DeploymentLocation": "Path to src/deployment folder of app-template-dotnet repo",
"AppLocation": "Path to src/App folder of app-template-dotnet repo"
}
}
Alternative to cloning app-templates-dotnet repo is to use following script to download template dependencies:
wget -O - https://api.github.com/repos/Altinn/app-template-dotnet/releases/latest | jq '.assets[]|select(.name | startswith("app-template-dotnet-") and endswith(".zip"))' | jq '.browser_download_url' | xargs wget -O apptemplate.zip && unzip apptemplate.zip && rm apptemplate.zipStart the webpack dev server for the respective app you want to develop:
yarn run start-app-development
yarn run start-dashboardIf you need to rebuild other React apps, for instance dashboard or app-development, this can be done by navigating
to frontend and then running the following build script, which will build app frontend apps.
yarn run buildSome React projects also have various other predefined scripts, which can be viewed in the package.json file
which is located in the root folder of each react project, example frontend/dashboard.
More about developing frontend can be found here.
Some integration tests for studio have been created with Cypress. More about these tests can be found here.
The current build is deployed in Kubernetes on Azure. Automated CI/CD using Azure DevOps pipelines.
- React/Redux - The front-end framework
- .NET Core/C# - The back-end framework
- yarn - Package management
- Docker - Container platform
- Kubernetes - Container orchestration
Please read CONTRIBUTING.md for details on our code of conduct, and the process for submitting pull requests to us.
- Altinn Studio development team - If you want to get in touch, just create a new issue.
See also the list of contributors who participated in this project.
This project is licensed under the 3-Clause BSD License - see the LICENSE.md file for details.