From 4eb33194d6bb3ac68b2591d8ff32164a7b7c1608 Mon Sep 17 00:00:00 2001 From: Dion Date: Sat, 28 Oct 2023 09:39:54 +0200 Subject: [PATCH] update docs --- .../developer-guide/github-actions/readme.md | 43 +++++++++++++------ .../technologies/react/readme.md | 41 ++++++++++-------- 2 files changed, 53 insertions(+), 31 deletions(-) diff --git a/documentation/docs/developer-guide/github-actions/readme.md b/documentation/docs/developer-guide/github-actions/readme.md index 51449af297..93fb7c2215 100644 --- a/documentation/docs/developer-guide/github-actions/readme.md +++ b/documentation/docs/developer-guide/github-actions/readme.md @@ -11,15 +11,16 @@ Build, test, and deploy your code right from GitHub. ## Important pipelines -- [Build desktop app (Create Desktop Release on tag for .Net Core and Electron)](#create-desktop-release-on-tag-for-net-core-and-electron) -- [Docker Hub on new version (Create Release on tag for docker hub)](#create-release-on-tag-for-docker-hub) -- [Docker unstable build (Docker buildx multi-arch CI unstable master)](#docker-buildx-multi-arch-ci-unstable-master) +- [Build desktop app (Create Desktop Release on tag for .Net Core and Electron)](#create-desktop-release-on-tag-for-net-core-and-electron) +- [Docker Hub on new version (Create Release on tag for docker hub)](#create-release-on-tag-for-docker-hub) +- [Docker unstable build (Docker buildx multi-arch CI unstable master)](#docker-buildx-multi-arch-ci-unstable-master) # All github actions used by this project There are multiple github actions used by this project. Bellow is a list of all github actions and a short on alphabet order. ## Auto upgrade .NET SDK version + Run weekly Automatically upgrade the .NET SDK version and upgrade nuget packages file when a new version is released. @@ -31,8 +32,9 @@ npm run nuget-package-list ``` > [auto-dotnet-sdk-version-upgrade.yml](https://github.com/qdraw/starsky/actions/workflows/auto-dotnet-sdk-version-upgrade.yml) - -## Application Version Auto update + +## Application Version Auto update + Run on push and manual trigger Upgrade the application version in the csproj file and package.json file @@ -46,6 +48,7 @@ npm run app-version-update > [auto-update-application-version.yml](https://github.com/qdraw/starsky/actions/workflows/auto-update-application-version.yml) ## Auto update Nuget packages list + On push on master branch Creates a list of nuget packages and their version in the nuget-package-list file @@ -77,7 +80,8 @@ npm run nuget-package-list > [auto-update-swagger-dotnet.yml](https://github.com/qdraw/starsky/actions/workflows/auto-update-swagger-dotnet.yml) -## auto clientapp create react app upgrade +## auto clientapp create react app upgrade [Change to VITE] + Bootstrap the client react app with the latest create react app version [![auto clientapp create react app upgrade](https://github.com/qdraw/starsky/actions/workflows/auto-upgrade-clientapp-create-react-app.yml/badge.svg)](https://github.com/qdraw/starsky/actions/workflows/auto-upgrade-clientapp-create-react-app.yml) @@ -90,6 +94,7 @@ npm run clientapp-create-react-app-update > [auto-upgrade-clientapp-create-react-app.yml](https://github.com/qdraw/starsky/actions/workflows/auto-upgrade-clientapp-create-react-app.yml) ## Auto Documentation create Docusaurus upgrade + Bootstrap the docs with the latest Docusaurus version [![Auto Documentation create Docusaurus upgrade](https://github.com/qdraw/starsky/actions/workflows/auto-upgrade-documentation-create-docusaurus.yml/badge.svg)](https://github.com/qdraw/starsky/actions/workflows/auto-upgrade-documentation-create-docusaurus.yml) @@ -102,6 +107,7 @@ npm run documentation-create-docusaurus-update > [auto-upgrade-documentation-create-docusaurus.yml](https://github.com/qdraw/starsky/actions/workflows/auto-upgrade-documentation-create-docusaurus.yml) ## ClientApp React Linux CI + Build for the ClientApp on linux Runs on pull request and push on the master branch @@ -117,6 +123,7 @@ npm run test:ci > [clientapp-react-linux-ci.yml](https://github.com/qdraw/starsky/actions/workflows/clientapp-react-linux-ci.yml) ## ClientApp React Windows CI + Build for the ClientApp on Windows Runs on pull request and push on the master branch @@ -132,18 +139,21 @@ npm run test:ci > [clientapp-react-windows-ci.yml](https://github.com/qdraw/starsky/actions/workflows/clientapp-react-windows-ci.yml) ## CodeQL analysis + Run CodeQL analysis on push and pull request > [codeql-analysis.yml](https://github.com/qdraw/starsky/actions/workflows/codeql-analysis.yml) ## Documentation to github pages + Deploy docs site to github pages > [documentation-gh-pages.yml](https://github.com/qdraw/starsky/actions/workflows/documentation-gh-pages.yml) ## end2end on ubuntu-ci + Cypress end to end testing on ubuntu ci -Runs a systemd service and a cypress test. +Runs a systemd service and a cypress test. See [Cypress Dashboard](https://cloud.cypress.io/projects/1yeai3/runs) and click on the tag: `ubuntu-ci` for more details. [![end2end on ubuntu-ci](https://github.com/qdraw/starsky/actions/workflows/end2end-ubuntu-ci.yml/badge.svg)](https://github.com/qdraw/starsky/actions/workflows/end2end-ubuntu-ci.yml) @@ -151,6 +161,7 @@ See [Cypress Dashboard](https://cloud.cypress.io/projects/1yeai3/runs) and click > [end2end-ubuntu-ci.yml](https://github.com/qdraw/starsky/actions/workflows/end2end-ubuntu-ci.yml) ## end2end on windows-ci + Cypress end to end testing on windows ci Runs a windows service and a cypress test. See [Cypress Dashboard](https://cloud.cypress.io/projects/1yeai3/runs) and click on the tag: `windows-ci` for more details. @@ -160,12 +171,14 @@ See [Cypress Dashboard](https://cloud.cypress.io/projects/1yeai3/runs) and click > [end2end-windows-ci.yml](https://github.com/qdraw/starsky/actions/workflows/end2end-windows-ci.yml) ## Create Release on tag for docker hub + On tag push create a release for docker hub runs on release of a new stable version > [release-on-tag-docker-hub.yml](https://github.com/qdraw/starsky/actions/workflows/release-on-tag-docker-hub.yml) ## Create Desktop Release on tag for .Net Core and Electron + Build the .NET runtime for Linux, Windows and Mac OS And build Electron Only create release when a new tag is pushed @@ -173,35 +186,41 @@ Only create release when a new tag is pushed > [release-on-tag-netcore-desktop-electron.yml](https://github.com/qdraw/starsky/actions/workflows/release-on-tag-netcore-desktop-electron.yml) ## Docker buildx multi-arch CI unstable master + Build docker images for testing > [starsky-docker-buildx.yml](https://github.com/qdraw/starsky/actions/workflows/starsky-docker-buildx.yml) ## Starsky .NET Core (Ubuntu) + CI build for .NET Core on Ubuntu Builds and runs unit tests in international mode and locale NL_nl due dot and comma issues > [starsky-dotnetcore-ubuntu.yml](https://github.com/qdraw/starsky/actions/workflows/starsky-dotnetcore-ubuntu.yml) ## Starsky .NET Core (Windows) + CI build for .NET Core on Windows Builds and runs unit tests > [starsky-dotnetcore-windows.yml](https://github.com/qdraw/starsky/actions/workflows/starsky-dotnetcore-windows.yml) ## Starsky SonarQube ClientApp NetCore Analyze PR + Analyze the code with SonarQube on Pull Request Runs only on pull requests > [starsky-sonarqube-clientapp-netcore.yml](https://github.com/qdraw/starsky/actions/workflows/starsky-sonarqube-clientapp-netcore.yml) ## Starsky Tools Node smoke test + Smoke tests for the starsky-tools -- dropbox import -- localtunnel -- mail -- mock service -- thumbnail + +- dropbox import +- localtunnel +- mail +- mock service +- thumbnail > [starsky-tools-node-smoke-test.yml](https://github.com/qdraw/starsky/actions/workflows/starsky-tools-node-smoke-test.yml) diff --git a/documentation/docs/developer-guide/technologies/react/readme.md b/documentation/docs/developer-guide/technologies/react/readme.md index 4e5c3a9a43..aa72ac772d 100644 --- a/documentation/docs/developer-guide/technologies/react/readme.md +++ b/documentation/docs/developer-guide/technologies/react/readme.md @@ -4,46 +4,49 @@ sidebar_position: 2 # React -ReactJS is a declarative, efficient, and flexible JavaScript library for building reusable UI components. +ReactJS is a declarative, efficient, and flexible JavaScript library for building reusable UI components. It is an open-source, component-based front end library responsible only for the view layer of the application. In this project we use ReactJS to build the user interface of the application. -The project is based on the Create React App with Typescript template. +The project is based on the Vite with Typescript template. + +## Vite + +Vite is a build tool and development server that is designed to enhance the development workflow for JavaScript applications. It offers fast, efficient, and near-instantaneous hot module replacement, making it an excellent choice for modern web development, especially in the context of Vue.js and React applications. Vite leverages native ES modules to improve build times and development speed, making it a popular choice among developers looking for a swift and productive development experience. ## TypeScript TypeScript is a syntactic superset of JavaScript which adds static typing. This basically means that TypeScript adds syntax on top of JavaScript, allowing developers to add types. -It adds optional static typing to JavaScript, -making it easier to catch type-related errors during development and to write large-scale applications. +It adds optional static typing to JavaScript, +making it easier to catch type-related errors during development and to write large-scale applications. The TypeScript code is transpiled to JavaScript, allowing it to run on any platform that supports JavaScript. TypeScript is widely used for developing large and complex web applications, -and its type system provides better documentation and improved code navigation. -TypeScript is supported by a large and growing community, -and many popular libraries and frameworks have TypeScript definitions available, +and its type system provides better documentation and improved code navigation. +TypeScript is supported by a large and growing community, +and many popular libraries and frameworks have TypeScript definitions available, making it easier to use these tools with TypeScript. ## Jest unit tests -Jest is a popular JavaScript testing framework that provides a seamless testing experience with its simple APIs, -built-in mocking, and assertion libraries. -It works with any JavaScript codebase and can be easily integrated into an existing project. -Jest also provides features like watch mode, code coverage reports, and parallel testing. +Jest is a popular JavaScript testing framework that provides a seamless testing experience with its simple APIs, +built-in mocking, and assertion libraries. +It works with any JavaScript codebase and can be easily integrated into an existing project. +Jest also provides features like watch mode, code coverage reports, and parallel testing. It is widely used for testing React applications but can be used for testing any JavaScript code. In this project we use Jest to test the typescript code and the React components of the application. We currently don't use snapshot testing. - ## React Testing Library -React Testing Library is a popular testing library for React applications. +React Testing Library is a popular testing library for React applications. It is designed to help developers test React components in a way that is similar to -how users interact with the components in a real application. -It focuses on testing the behavior of a component, rather than its implementation details. -React Testing Library provides APIs for performing common testing tasks, like rendering components, -querying elements, and simulating user events. By using this library, -developers can write tests that are more focused on the user experience and less on implementation details, -making their tests more maintainable and less prone to break with future changes. \ No newline at end of file +how users interact with the components in a real application. +It focuses on testing the behavior of a component, rather than its implementation details. +React Testing Library provides APIs for performing common testing tasks, like rendering components, +querying elements, and simulating user events. By using this library, +developers can write tests that are more focused on the user experience and less on implementation details, +making their tests more maintainable and less prone to break with future changes.