From 2a156ea08f827a439ca7c0f94e473be51c7f62fe Mon Sep 17 00:00:00 2001 From: Rico Saupe <145867813+RicoSaupe@users.noreply.github.com> Date: Sat, 9 Dec 2023 19:50:46 +0100 Subject: [PATCH 1/7] moved topic pages into their own folders and fixed already existing missing links. --- docs/{ => components}/component-azure.md | 0 docs/{ => components}/component-elmish.md | 2 +- docs/{ => components}/component-fable.md | 6 +- docs/{ => components}/component-saturn.md | 2 +- docs/{ => faq}/faq-build.md | 0 docs/{ => faq}/faq-troubleshooting.md | 2 +- docs/{ => features}/feature-azurefunctions.md | 0 .../feature-clientserver-basics.md | 0 .../feature-clientserver-bridge.md | 144 +++++++++--------- .../feature-clientserver-http.md | 0 .../feature-clientserver-remoting.md | 0 .../feature-clientserver-serialization.md | 0 docs/{ => features}/feature-clientserver.md | 68 ++++----- docs/{ => features}/feature-hmr.md | 0 docs/{ => features}/feature-ssr.md | 0 docs/intro.md | 2 +- docs/overview.md | 8 +- docs/quickstart.md | 2 +- docs/recipes/client-server/fable-remoting.md | 4 +- .../javascript/third-party-react-package.md | 6 +- docs/recipes/upgrading/v2-to-v3.md | 2 +- docs/recipes/upgrading/v3-to-v4.md | 2 +- docs/v4-recipes/build/add-build-script.md | 2 +- docs/v4-recipes/build/bundle-app.md | 6 +- docs/v4-recipes/build/remove-fake.md | 2 +- .../client-server/fable-remoting.md | 4 +- .../client-server/upload-file-from-client.md | 2 +- .../javascript/third-party-react-package.md | 6 +- .../add-nuget-package-to-client.md | 2 +- .../add-nuget-package-to-server.md | 2 +- docs/v4-recipes/ui/add-daisyui.md | 2 +- docs/v4-recipes/ui/add-tailwind.md | 2 +- docs/v4-recipes/ui/cdn-to-npm.md | 4 +- .../ui/use-different-bulma-themes.md | 2 +- mkdocs.yml | 30 ++-- 35 files changed, 158 insertions(+), 158 deletions(-) rename docs/{ => components}/component-azure.md (100%) rename docs/{ => components}/component-elmish.md (81%) rename docs/{ => components}/component-fable.md (80%) rename docs/{ => components}/component-saturn.md (97%) rename docs/{ => faq}/faq-build.md (100%) rename docs/{ => faq}/faq-troubleshooting.md (96%) rename docs/{ => features}/feature-azurefunctions.md (100%) rename docs/{ => features}/feature-clientserver-basics.md (100%) rename docs/{ => features}/feature-clientserver-bridge.md (91%) rename docs/{ => features}/feature-clientserver-http.md (100%) rename docs/{ => features}/feature-clientserver-remoting.md (100%) rename docs/{ => features}/feature-clientserver-serialization.md (100%) rename docs/{ => features}/feature-clientserver.md (98%) rename docs/{ => features}/feature-hmr.md (100%) rename docs/{ => features}/feature-ssr.md (100%) diff --git a/docs/component-azure.md b/docs/components/component-azure.md similarity index 100% rename from docs/component-azure.md rename to docs/components/component-azure.md diff --git a/docs/component-elmish.md b/docs/components/component-elmish.md similarity index 81% rename from docs/component-elmish.md rename to docs/components/component-elmish.md index b26b5a4d..11c6f00f 100644 --- a/docs/component-elmish.md +++ b/docs/components/component-elmish.md @@ -14,7 +14,7 @@ stateDiagram-v2 ``` ## How does Elmish integrate with SAFE? -Elmish is the library used to build the front-end application in SAFE and that application is compiled to JavaScript by [Fable](component-fable.md) to run in the browser. The [SAFE Stack template](template-overview.md) comes pre-bundled with the [Elmish React](https://elmish.github.io/react/) module, which (as the name suggests) uses the [React](https://reactjs.org/) library to handle the heavy lifting of modifyng the DOM in an efficient way. This allow us to use the pure functional style of the MVU pattern whilst still retaining the ability to have a highly performant user interface. +Elmish is the library used to build the front-end application in SAFE and that application is compiled to JavaScript by [Fable](component-fable.md) to run in the browser. The [SAFE Stack template](../template-overview.md) comes pre-bundled with the [Elmish React](https://elmish.github.io/react/) module, which (as the name suggests) uses the [React](https://reactjs.org/) library to handle the heavy lifting of modifyng the DOM in an efficient way. This allow us to use the pure functional style of the MVU pattern whilst still retaining the ability to have a highly performant user interface. Because Elmish works alongside React, it is possible to use the vast number of available React components from the JavaScript ecosystem within our Elmish applications. diff --git a/docs/component-fable.md b/docs/components/component-fable.md similarity index 80% rename from docs/component-fable.md rename to docs/components/component-fable.md index 57aefc2a..68fca878 100644 --- a/docs/component-fable.md +++ b/docs/components/component-fable.md @@ -9,12 +9,12 @@ It also provides *rich* integration with the JS ecosystem which means that you c ## How does Fable integrate with SAFE? -Fable is a tool that generates JavaScript files from F# code. This allows us to write full front end applications using F#. Being able to write both the Server and Client in the same language offers huge benefits especially when you can share code between the two, without the need for duplication. More information on code sharing can be found [here](feature-clientserver.md). +Fable is a tool that generates JavaScript files from F# code. This allows us to write full front end applications using F#. Being able to write both the Server and Client in the same language offers huge benefits especially when you can share code between the two, without the need for duplication. More information on code sharing can be found [here](../features/feature-clientserver.md). ## Fable and Vite -As Fable allows us to integrate into the JS Ecosystem, we can make use of tools such as Vite with features including [Hot Module replacement](feature-hmr.md) and Source Maps. +As Fable allows us to integrate into the JS Ecosystem, we can make use of tools such as Vite with features including [Hot Module replacement](../features/feature-hmr.md) and Source Maps. -The [SAFE Template](template-overview.md) already has Vite configured to get you up and running immediately. +The [SAFE Template](../template-overview.md) already has Vite configured to get you up and running immediately. Learn more about Fable [here](http://fable.io/). diff --git a/docs/component-saturn.md b/docs/components/component-saturn.md similarity index 97% rename from docs/component-saturn.md rename to docs/components/component-saturn.md index 9f3dd657..2aed2764 100644 --- a/docs/component-saturn.md +++ b/docs/components/component-saturn.md @@ -15,7 +15,7 @@ Saturn provides the ability to drive your SAFE applications from the server. It * Hosting of your client-side assets, such as HTML, CSS and JavaScript generated by Fable. * Other cross cutting concerns e.g. authentication etc. -It also integrates with SAFE to allow seamless sharing of types and functions, since Fable will convert most F# into JavaScript. In addition, you can seamless transport data between client and server using either the Fable.JSON or Fable.Remoting libraries, both of which have support for Saturn. You can read more about this [here](feature-clientserver.md). +It also integrates with SAFE to allow seamless sharing of types and functions, since Fable will convert most F# into JavaScript. In addition, you can seamless transport data between client and server using either the Fable.JSON or Fable.Remoting libraries, both of which have support for Saturn. You can read more about this [here](../features/feature-clientserver.md). ```mermaid flowchart TB diff --git a/docs/faq-build.md b/docs/faq/faq-build.md similarity index 100% rename from docs/faq-build.md rename to docs/faq/faq-build.md diff --git a/docs/faq-troubleshooting.md b/docs/faq/faq-troubleshooting.md similarity index 96% rename from docs/faq-troubleshooting.md rename to docs/faq/faq-troubleshooting.md index 3a2be402..07830c74 100644 --- a/docs/faq-troubleshooting.md +++ b/docs/faq/faq-troubleshooting.md @@ -27,7 +27,7 @@ You may see the following `SocketProtocolError` message in the Debug Console onc
-Whilst these messages can be safely ignored, you can eliminate them by installing **Redux Dev Tools** in the launched Chrome instance as described in the debugging [prerequisites](v4-recipes/developing-and-testing/debug-safe-app.md#0-install-prerequisites) section. +Whilst these messages can be safely ignored, you can eliminate them by installing **Redux Dev Tools** in the launched Chrome instance as described in the debugging [prerequisites](../v4-recipes/developing-and-testing/debug-safe-app.md#0-install-prerequisites) section. ### Node Process does not stop after stopping the VS Code debugger VS Code does not kill the Fable process when you stop the debugger, leaving it running as a "zombie". In such a case, you will have to explicitly kill the process otherwise it will hold onto diff --git a/docs/feature-azurefunctions.md b/docs/features/feature-azurefunctions.md similarity index 100% rename from docs/feature-azurefunctions.md rename to docs/features/feature-azurefunctions.md diff --git a/docs/feature-clientserver-basics.md b/docs/features/feature-clientserver-basics.md similarity index 100% rename from docs/feature-clientserver-basics.md rename to docs/features/feature-clientserver-basics.md diff --git a/docs/feature-clientserver-bridge.md b/docs/features/feature-clientserver-bridge.md similarity index 91% rename from docs/feature-clientserver-bridge.md rename to docs/features/feature-clientserver-bridge.md index de8fc2f3..7295d6d7 100644 --- a/docs/feature-clientserver-bridge.md +++ b/docs/features/feature-clientserver-bridge.md @@ -1,72 +1,72 @@ -Using F# on both client and server is at the core of the SAFE stack, as it simplifies the way we think about building web applications by using the same language, idioms and in many cases sharing our code and domain models. - -However, building a client and a server app requires a fundamentally different way of thinking. On the server side we build [stateless APIs in Saturn](component-saturn.md) that map HTTP requests to internal functionality, whereas on the frontend we use the Elmish model, implementing the [model-view-update pattern](component-elmish.md): a stateful pattern that lets us think about the application state as it evolves while the application is running. - -Even though we use the same language across platforms, applying these two different programming models forces us to switch our way of thinking back and forth when writing code for the client and for the server. This is where the [Elmish.Bridge](https://github.com/Nhowka/Elmish.Bridge) library comes into play: it brings the Elmish programming model *to the server* and unifies the way we write the application as a whole. - -## How does Elmish work on the server? -Think of Elmish on the server as the model-view-update pattern but *without the view part*. Instead, you only need to implement `init` and `update` functions to manage the *server* state as it evolves while the server is running. - -* Server state can contain data that is relevant to a single or all clients -* The dispatch loop running on the server is connected to the dispatch loop on the client via a *persistent stateful websocket connection* -* The `update` functions on client and server can exchange data via message passing. - -## A simple example -Let's see a simple example of how this might work in practice: - -```fsharp -// Client-side -let update msg state = - match msg with - | LoadUsers -> - // send the message to the server - state, Cmd.bridgeSend ServerMsg.LoadUsers - | UsersLoaded users -> - // receive message from the server - let nextState = { state with Users = users } - nextState, Cmd.none - -// Server-side -let update clientDispatch msg state = - match msg with - | ServerMsg.LoadUsers -> - let loadUsersCmd = - Cmd.ofAsync - getUsersFromDb // unit -> Async - () // input arg = unit - UsersLoadedFromDb // User list -> ServerMsg - DoNothing // ServerMsg - state, loadUsersCmd - - | ServerMsg.UsersLoadedFromDbSuccess users -> - // answer the current connected client with data - clientDispatch (ClientMsg.UsersLoaded users) - state, Cmd.none - - | ServerMsg.DoNothing -> - state, Cmd.none -``` - -The above example mimics what would have been a `GET` request to the server to get user data from database. However, now the client sends a fire-and-forget message to the server to load users, and at some point the server messages the current client back with the results. Notice that the server could have decided to do other things than just messaging the client back: for example, it could have broadcasted the same message to other clients updating their local state of the users. - -## When to use Elmish.Bridge -There are many scenarios where it makes sense to use Elmish.Bridge: - -* Chat-like applications with many connected users through many channels -* Syncing price data in real-time while viewing ticket prices -* Multiplayer games that need real-time update of game states -* Other applications of web sockets through an Elmish model - -## Things to consider -The biggest distinction between using this and "raw" Saturn is that your web server becomes a stateful service. This introduces several differences for application design. - -1. The server state has a lifespan equal to the that of the process under which the server instance is running. This means if the server application restarts then the server state will be reset. - -2. The server state is *local to the server instance*. This means that if you run multiple web servers, they won't be sharing the same server state by default. - -As of now there is no built-in persistence for the state, but you can implement this yourself using any number of persistance layers such as Redis Cache, Azure Tables or Blobs etc. - -In addition Elmish.Bridge does not use standard HTTP verbs for communication, but rather websockets. Therefore, it is not a suitable technology for an open web server that can serve requests from other sources than Elmish.Bridge clients. - -## Learn more about Elmish.Bridge -Head over to [Elmish.Bridge](https://github.com/Nhowka/Elmish.Bridge) to learn more. +Using F# on both client and server is at the core of the SAFE stack, as it simplifies the way we think about building web applications by using the same language, idioms and in many cases sharing our code and domain models. + +However, building a client and a server app requires a fundamentally different way of thinking. On the server side we build [stateless APIs in Saturn](../components/component-saturn.md) that map HTTP requests to internal functionality, whereas on the frontend we use the Elmish model, implementing the [model-view-update pattern](../components/component-elmish.md): a stateful pattern that lets us think about the application state as it evolves while the application is running. + +Even though we use the same language across platforms, applying these two different programming models forces us to switch our way of thinking back and forth when writing code for the client and for the server. This is where the [Elmish.Bridge](https://github.com/Nhowka/Elmish.Bridge) library comes into play: it brings the Elmish programming model *to the server* and unifies the way we write the application as a whole. + +## How does Elmish work on the server? +Think of Elmish on the server as the model-view-update pattern but *without the view part*. Instead, you only need to implement `init` and `update` functions to manage the *server* state as it evolves while the server is running. + +* Server state can contain data that is relevant to a single or all clients +* The dispatch loop running on the server is connected to the dispatch loop on the client via a *persistent stateful websocket connection* +* The `update` functions on client and server can exchange data via message passing. + +## A simple example +Let's see a simple example of how this might work in practice: + +```fsharp +// Client-side +let update msg state = + match msg with + | LoadUsers -> + // send the message to the server + state, Cmd.bridgeSend ServerMsg.LoadUsers + | UsersLoaded users -> + // receive message from the server + let nextState = { state with Users = users } + nextState, Cmd.none + +// Server-side +let update clientDispatch msg state = + match msg with + | ServerMsg.LoadUsers -> + let loadUsersCmd = + Cmd.ofAsync + getUsersFromDb // unit -> Async + () // input arg = unit + UsersLoadedFromDb // User list -> ServerMsg + DoNothing // ServerMsg + state, loadUsersCmd + + | ServerMsg.UsersLoadedFromDbSuccess users -> + // answer the current connected client with data + clientDispatch (ClientMsg.UsersLoaded users) + state, Cmd.none + + | ServerMsg.DoNothing -> + state, Cmd.none +``` + +The above example mimics what would have been a `GET` request to the server to get user data from database. However, now the client sends a fire-and-forget message to the server to load users, and at some point the server messages the current client back with the results. Notice that the server could have decided to do other things than just messaging the client back: for example, it could have broadcasted the same message to other clients updating their local state of the users. + +## When to use Elmish.Bridge +There are many scenarios where it makes sense to use Elmish.Bridge: + +* Chat-like applications with many connected users through many channels +* Syncing price data in real-time while viewing ticket prices +* Multiplayer games that need real-time update of game states +* Other applications of web sockets through an Elmish model + +## Things to consider +The biggest distinction between using this and "raw" Saturn is that your web server becomes a stateful service. This introduces several differences for application design. + +1. The server state has a lifespan equal to the that of the process under which the server instance is running. This means if the server application restarts then the server state will be reset. + +2. The server state is *local to the server instance*. This means that if you run multiple web servers, they won't be sharing the same server state by default. + +As of now there is no built-in persistence for the state, but you can implement this yourself using any number of persistance layers such as Redis Cache, Azure Tables or Blobs etc. + +In addition Elmish.Bridge does not use standard HTTP verbs for communication, but rather websockets. Therefore, it is not a suitable technology for an open web server that can serve requests from other sources than Elmish.Bridge clients. + +## Learn more about Elmish.Bridge +Head over to [Elmish.Bridge](https://github.com/Nhowka/Elmish.Bridge) to learn more. diff --git a/docs/feature-clientserver-http.md b/docs/features/feature-clientserver-http.md similarity index 100% rename from docs/feature-clientserver-http.md rename to docs/features/feature-clientserver-http.md diff --git a/docs/feature-clientserver-remoting.md b/docs/features/feature-clientserver-remoting.md similarity index 100% rename from docs/feature-clientserver-remoting.md rename to docs/features/feature-clientserver-remoting.md diff --git a/docs/feature-clientserver-serialization.md b/docs/features/feature-clientserver-serialization.md similarity index 100% rename from docs/feature-clientserver-serialization.md rename to docs/features/feature-clientserver-serialization.md diff --git a/docs/feature-clientserver.md b/docs/features/feature-clientserver.md similarity index 98% rename from docs/feature-clientserver.md rename to docs/features/feature-clientserver.md index 04665652..4163849a 100644 --- a/docs/feature-clientserver.md +++ b/docs/features/feature-clientserver.md @@ -1,34 +1,34 @@ -One of the most powerful features of SAFE is the ability to seamlessly share code across client and server. - -## Sharing Basics -The basics of code sharing across client and server include: - -* Sharing **types**. Useful for contracts between client and server, as well as to share a common domain. -* Sharing **behaviour**. In other words, functions that perform e.g. shared validation or similar. - -These two core areas are explained in more detail [here](feature-clientserver-basics.md). - -## Sending messages between client and server -In addition to types and messages, there are several technologies available in SAFE that allow you to send messages from client to server (and from server to client). Each has their own strengths and weaknesses: - -* [Contracts / protocols](feature-clientserver-remoting.md) via Fable Remoting. -* [Raw HTTP](feature-clientserver-http.md) using Saturn's routing capabilities. -* [Stateful servers](feature-clientserver-bridge.md) through Elmish Bridge. - -## Which technology should I use? -Fable Remoting provides an excellent way to quickly get up and running with the SAFE stack. You can rapidly create contracts and have guaranteed type-safety between both client and server. Consider using remoting for rapid prototyping, since JSON serialization and HTTP routing is handled by the library, you only think of your client-server code in terms of types and stateless functions. **Fable remoting is our recommended option for SAFE Stack apps where you "own" the client and server.** However, if you need full control over the HTTP channel for returning specific status codes, using custom HTTP verbs or working with headers, then remoting might not for be you. - -The raw HTTP model provided by Saturn with `router { }` requires you to construct routes manually and does not guarantee that the client and endpoint have the same contract (you have to specify the same type on both sides yourself). However, using the raw HTTP model gives you total control over the routing and verbs used. If you have a public API that is exposed not just to your own application but to third-parties, or you need more fine grained control over your routes and data, you should use this approach. - -Lastly, Elmish.Bridge provides an alternative way of modelling client/server communication. Unlike the other two mechanisms, Elmish Bridge provides the same Elmish model on the server as well as the client, as well as the ability to send notifications from the server back to connected clients via websockets. However, the Bridge model is inherently stateful, which means that a server restart could impact all connected clients. - -| | Fable.Remoting | Raw HTTP | Elmish.Bridge | -|-|:-:|:-:|:-:| -| Client / Server support | Very easy | Easy | Very Easy | -| State model | Stateless | Stateless | Stateful | -| "Open" API? | Yes, with limitations | Yes | No | -| HTTP Verbs? | POST, GET | Fully Configurable | None | -| Push messages? | No | With Channels | Yes | -| Pipeline Control? | Limited | Full | Limited | - -Consider using a combination of multiple endpoints supporting combinations of the above to suit your needs! +One of the most powerful features of SAFE is the ability to seamlessly share code across client and server. + +## Sharing Basics +The basics of code sharing across client and server include: + +* Sharing **types**. Useful for contracts between client and server, as well as to share a common domain. +* Sharing **behaviour**. In other words, functions that perform e.g. shared validation or similar. + +These two core areas are explained in more detail [here](feature-clientserver-basics.md). + +## Sending messages between client and server +In addition to types and messages, there are several technologies available in SAFE that allow you to send messages from client to server (and from server to client). Each has their own strengths and weaknesses: + +* [Contracts / protocols](feature-clientserver-remoting.md) via Fable Remoting. +* [Raw HTTP](feature-clientserver-http.md) using Saturn's routing capabilities. +* [Stateful servers](feature-clientserver-bridge.md) through Elmish Bridge. + +## Which technology should I use? +Fable Remoting provides an excellent way to quickly get up and running with the SAFE stack. You can rapidly create contracts and have guaranteed type-safety between both client and server. Consider using remoting for rapid prototyping, since JSON serialization and HTTP routing is handled by the library, you only think of your client-server code in terms of types and stateless functions. **Fable remoting is our recommended option for SAFE Stack apps where you "own" the client and server.** However, if you need full control over the HTTP channel for returning specific status codes, using custom HTTP verbs or working with headers, then remoting might not for be you. + +The raw HTTP model provided by Saturn with `router { }` requires you to construct routes manually and does not guarantee that the client and endpoint have the same contract (you have to specify the same type on both sides yourself). However, using the raw HTTP model gives you total control over the routing and verbs used. If you have a public API that is exposed not just to your own application but to third-parties, or you need more fine grained control over your routes and data, you should use this approach. + +Lastly, Elmish.Bridge provides an alternative way of modelling client/server communication. Unlike the other two mechanisms, Elmish Bridge provides the same Elmish model on the server as well as the client, as well as the ability to send notifications from the server back to connected clients via websockets. However, the Bridge model is inherently stateful, which means that a server restart could impact all connected clients. + +| | Fable.Remoting | Raw HTTP | Elmish.Bridge | +|-|:-:|:-:|:-:| +| Client / Server support | Very easy | Easy | Very Easy | +| State model | Stateless | Stateless | Stateful | +| "Open" API? | Yes, with limitations | Yes | No | +| HTTP Verbs? | POST, GET | Fully Configurable | None | +| Push messages? | No | With Channels | Yes | +| Pipeline Control? | Limited | Full | Limited | + +Consider using a combination of multiple endpoints supporting combinations of the above to suit your needs! diff --git a/docs/feature-hmr.md b/docs/features/feature-hmr.md similarity index 100% rename from docs/feature-hmr.md rename to docs/features/feature-hmr.md diff --git a/docs/feature-ssr.md b/docs/features/feature-ssr.md similarity index 100% rename from docs/feature-ssr.md rename to docs/features/feature-ssr.md diff --git a/docs/intro.md b/docs/intro.md index daeb2ca4..708b4ecf 100644 --- a/docs/intro.md +++ b/docs/intro.md @@ -23,7 +23,7 @@ SAFE provides developers with a simple and consistent programming model for deve * Re-use development skills on client and server * Rapidly create rich client-side web applications with no JavaScript knowledge * Runs on the latest .NET (and tested daily by Microsoft) -* Rapid development cycle with support for [hot module replacement](feature-hmr.md) +* Rapid development cycle with support for [hot module replacement](features/feature-hmr.md) * Interact with native JavaScript libraries whenever needed * Create client-side applications purely in F#, with full type checking for safety * Seamlessly share code between client and server diff --git a/docs/overview.md b/docs/overview.md index bcd1fc92..0f501ae2 100644 --- a/docs/overview.md +++ b/docs/overview.md @@ -17,18 +17,18 @@ flowchart TB ``` -### [Saturn](component-saturn.md) +### [Saturn](components/component-saturn.md) The Saturn library builds on top of the solid foundation of both the F#-friendly [Giraffe](https://github.com/giraffe-fsharp/Giraffe) and the high performance, rock-solid [ASP.NET Core](https://docs.microsoft.com/en-us/aspnet/core/?view=aspnetcore-2.1) web server to provide a set of optional abstractions which make configuring web applications and constructing complex routes extremely easy to achieve. Saturn can host RESTful API endpoints, drive static websites or server-generated content, all inside an easy-to-learn functional programming model. -### [Microsoft Azure](component-azure.md) +### [Microsoft Azure](components/component-azure.md) Azure is a comprehensive set of cloud services that developers and IT professionals use to build, deploy and manage applications through a global network of data centres. Integrated tools, DevOps and a marketplace support you in efficiently building anything from simple mobile apps to Internet-scale solutions. -### [Fable](component-fable.md) +### [Fable](components/component-fable.md) Fable is an F# to JavaScript compiler, designed to produce readable and standard code. Fable allows you to create applications for the browser written entirely in F#, whilst also allowing you to interact with native JavaScript as needed. -### [Elmish](component-elmish.md) +### [Elmish](components/component-elmish.md) The Elmish model allows you to construct user interfaces running in the browser using a functional programming approach. Based upon on the Elm application model, Elmish uses the Model-View-Update paradigm to allow you to write applications that are simple to reason about. Elmish sits on top of the [React](https://reactjs.org/) framework. ## Further reading diff --git a/docs/quickstart.md b/docs/quickstart.md index 672af396..7624cfb4 100644 --- a/docs/quickstart.md +++ b/docs/quickstart.md @@ -32,4 +32,4 @@ Congratulations - after a short delay, you'll be presented with a basic SAFE app The standard template creates an opinionated SAFE Stack app that contains everything you'll need to start developing, testing and deploying applications into Azure. Alternatively there is a "bare-bones" SAFE Stack app with minimal value-add features. Take a look at the [template options](template-overview.md#template-options) to see a side by side comparison of features available between the *standard* and *minimal* template. ## Troubleshooting -Still have issues getting started? Check out the [troubleshooting](faq-troubleshooting.md) page. +Still have issues getting started? Check out the [troubleshooting](faq/faq-troubleshooting.md) page. diff --git a/docs/recipes/client-server/fable-remoting.md b/docs/recipes/client-server/fable-remoting.md index 8e50b5fd..51a21d71 100644 --- a/docs/recipes/client-server/fable-remoting.md +++ b/docs/recipes/client-server/fable-remoting.md @@ -6,8 +6,8 @@ #### 1. Install NuGet Packages Add [Fable.Remoting.Giraffe](https://www.nuget.org/packages/Fable.Remoting.Giraffe/) to the Server and [Fable.Remoting.Client](https://www.nuget.org/packages/Fable.Remoting.Client/) to the Client. -> See [How Do I Add a NuGet Package to the Server](../../package-management/add-nuget-package-to-server) -> and [How Do I Add a NuGet Package to the Client](../../package-management/add-nuget-package-to-client). +> See [How Do I Add a NuGet Package to the Server](../package-management/add-nuget-package-to-server.md) +> and [How Do I Add a NuGet Package to the Client](../../v4-recipes/package-management/add-nuget-package-to-client.md). #### 2. Create the API protocol You now need to create the protocol, or contract, of the API we’ll be creating. Insert the following below the `Route` module in `Shared.fs`: diff --git a/docs/recipes/javascript/third-party-react-package.md b/docs/recipes/javascript/third-party-react-package.md index bc20b0f0..56dde40d 100644 --- a/docs/recipes/javascript/third-party-react-package.md +++ b/docs/recipes/javascript/third-party-react-package.md @@ -1,7 +1,7 @@ To use a third-party React library in a SAFE application, you need to write an F# wrapper around it. There are two ways for doing this - using [Fable.React](https://www.nuget.org/packages/Fable.React/) or using [Feliz](https://zaid-ajaj.github.io/Feliz/). ## Prerequisites -This recipe uses the [react-d3-speedometer NPM package](https://www.npmjs.com/package/react-d3-speedometer) for demonstration purposes. [Add it to your Client](../../package-management/add-npm-package-to-client) before continuing. +This recipe uses the [react-d3-speedometer NPM package](https://www.npmjs.com/package/react-d3-speedometer) for demonstration purposes. [Add it to your Client](../package-management/add-npm-package-to-client.md) before continuing. ## Fable.React - Setup @@ -57,7 +57,7 @@ reactSpeedometer [ ## Feliz - Setup -If you don't already have [Feliz](https://www.nuget.org/packages/Feliz/) installed, [add it to your client](../../ui/add-feliz). +If you don't already have [Feliz](https://www.nuget.org/packages/Feliz/) installed, [add it to your client](../../v4-recipes/ui/add-feliz.md). In the Client projects `Index.fs` add the following snippets ```fsharp @@ -85,7 +85,7 @@ As a quick check to ensure that the library is being imported and we have no typ Browser.Dom.console.log("REACT-D3-IMPORT", importDefault "react-d3-speedometer") ``` In the console window (which can be reached by right-clicking and selecting Insepct Element) you should see some output from the above log. -If nothing is being seen you may need a slightly different import statement, [please refer to this recipe](../import-js-module). +If nothing is being seen you may need a slightly different import statement, [please refer to this recipe](../../v4-recipes/javascript/import-js-module.md). - `createObj` from `Fable.Core.JsInterop` takes a sequence of `string * obj` which is a prop name and value for the component, you can find the full prop list for react-d3-speedometer [here](https://www.npmjs.com/package/react-d3-speedometer). - Using `==>` (short hand for `prop.custom`) to transform the sequence into a JavaScript object diff --git a/docs/recipes/upgrading/v2-to-v3.md b/docs/recipes/upgrading/v2-to-v3.md index 90e3b63f..e0773dd3 100644 --- a/docs/recipes/upgrading/v2-to-v3.md +++ b/docs/recipes/upgrading/v2-to-v3.md @@ -2,7 +2,7 @@ There have been a number of changes between the second and third major versions of the SAFE template. This guide shows you how to upgrade your v2 project to v3. -> If you haven't done so already then you will need to install the prequisites listed in the [Quick Start](../../../quickstart) guide. +> If you haven't done so already then you will need to install the prequisites listed in the [Quick Start](../../quickstart.md) guide. ### Terminology for this Recipe: diff --git a/docs/recipes/upgrading/v3-to-v4.md b/docs/recipes/upgrading/v3-to-v4.md index 4c4fb289..058a0b42 100644 --- a/docs/recipes/upgrading/v3-to-v4.md +++ b/docs/recipes/upgrading/v3-to-v4.md @@ -2,7 +2,7 @@ This guide shows you how to upgrade your v3 project to v4. -> If you haven't done so already then you will need to install the prequisites listed in the [Quick Start](../../../quickstart) guide. +> If you haven't done so already then you will need to install the prequisites listed in the [Quick Start](../../quickstart.md) guide. ### Terminology for this Recipe: diff --git a/docs/v4-recipes/build/add-build-script.md b/docs/v4-recipes/build/add-build-script.md index ff6c14dc..96400f99 100644 --- a/docs/v4-recipes/build/add-build-script.md +++ b/docs/v4-recipes/build/add-build-script.md @@ -3,7 +3,7 @@ ## FAKE [Fake](https://fake.build/) is a DSL for build tasks that is modular, extensible and easy to start with. Fake allows you to easily build, bundle, deploy your app and more by executing a single command. -> The standard template comes [with a FAKE project](../../../template-safe-commands) by default, so **this recipe only applies to the minimal template**. +> The standard template comes [with a FAKE project](../../template-safe-commands.md) by default, so **this recipe only applies to the minimal template**. --- #### 1. Create a build project diff --git a/docs/v4-recipes/build/bundle-app.md b/docs/v4-recipes/build/bundle-app.md index c5bacd97..1a93b370 100644 --- a/docs/v4-recipes/build/bundle-app.md +++ b/docs/v4-recipes/build/bundle-app.md @@ -1,6 +1,6 @@ # How do I bundle my SAFE application? -When developing your SAFE application, the local runtime experience uses WebPack to run the client and redirect API calls to the server on a [different port](../../../faq-build). However, when you *deploy* your application, you'll need to run your Saturn server which will serve up statically-built client resources (HTML, JavaScript, CSS etc.). +When developing your SAFE application, the local runtime experience uses WebPack to run the client and redirect API calls to the server on a [different port](../../faq/faq-build.md). However, when you *deploy* your application, you'll need to run your Saturn server which will serve up statically-built client resources (HTML, JavaScript, CSS etc.). ## I'm using the standard template @@ -13,7 +13,7 @@ dotnet run Bundle This will build and package up both the client and server and place them into the `/deploy` folder at the root of the repository. -> See [here](../../../template-safe-commands) for more details on this build target. +> See [here](../../template-safe-commands.md) for more details on this build target. ## I'm using the minimal template If you created your SAFE app using the **minimal** option, you need to bundle up the client and server separately. @@ -50,4 +50,4 @@ This will bundle the server project and copy all outputs into the `deploy` folde You should now see your SAFE application. ## Further reading -See [this article](/docs/faq-build) for more information on architectural concerns regarding the move from dev to production and bundling SAFE Stack applications. +See [this article](../../faq/faq-build.md) for more information on architectural concerns regarding the move from dev to production and bundling SAFE Stack applications. diff --git a/docs/v4-recipes/build/remove-fake.md b/docs/v4-recipes/build/remove-fake.md index 42ac9eb6..c72e6902 100644 --- a/docs/v4-recipes/build/remove-fake.md +++ b/docs/v4-recipes/build/remove-fake.md @@ -1,5 +1,5 @@ # How do I remove the use of FAKE? -[FAKE](https://fake.build/) is a tool for build automation. The standard SAFE template comes with a [ready-made build project](../../../template-safe-commands) at the root of the solution that provides support for many common SAFE tasks. +[FAKE](https://fake.build/) is a tool for build automation. The standard SAFE template comes with a [ready-made build project](../../template-safe-commands.md) at the root of the solution that provides support for many common SAFE tasks. If you would prefer not to use FAKE, you can of course simply ignore it, but this recipes shows how to completely remove it from your repository. It is important to note that having removed FAKE, you will have to follow a more manual approach to each of these processes. This recipe will only include instructions on how to build and deploy the application after removing FAKE. diff --git a/docs/v4-recipes/client-server/fable-remoting.md b/docs/v4-recipes/client-server/fable-remoting.md index 8e50b5fd..360d2df7 100644 --- a/docs/v4-recipes/client-server/fable-remoting.md +++ b/docs/v4-recipes/client-server/fable-remoting.md @@ -6,8 +6,8 @@ #### 1. Install NuGet Packages Add [Fable.Remoting.Giraffe](https://www.nuget.org/packages/Fable.Remoting.Giraffe/) to the Server and [Fable.Remoting.Client](https://www.nuget.org/packages/Fable.Remoting.Client/) to the Client. -> See [How Do I Add a NuGet Package to the Server](../../package-management/add-nuget-package-to-server) -> and [How Do I Add a NuGet Package to the Client](../../package-management/add-nuget-package-to-client). +> See [How Do I Add a NuGet Package to the Server](../../v4-recipes/package-management/add-nuget-package-to-server.md) +> and [How Do I Add a NuGet Package to the Client](../../v4-recipes/package-management/add-nuget-package-to-client.md). #### 2. Create the API protocol You now need to create the protocol, or contract, of the API we’ll be creating. Insert the following below the `Route` module in `Shared.fs`: diff --git a/docs/v4-recipes/client-server/upload-file-from-client.md b/docs/v4-recipes/client-server/upload-file-from-client.md index ed17608e..8c6f8741 100644 --- a/docs/v4-recipes/client-server/upload-file-from-client.md +++ b/docs/v4-recipes/client-server/upload-file-from-client.md @@ -78,7 +78,7 @@ let createFileUpload onLoad = #### 4. Use the UI Element -Having followed all these steps, you can now use the `createFileUpload` function in `Index.fs` to create the UI element for uploading files. One thing to note is that `HandleFile` is a case of the discriminated union type `Msg` that's in `Index.fs`. You can use this message case to [send the file from the client to the server](../messaging-post). +Having followed all these steps, you can now use the `createFileUpload` function in `Index.fs` to create the UI element for uploading files. One thing to note is that `HandleFile` is a case of the discriminated union type `Msg` that's in `Index.fs`. You can use this message case to [send the file from the client to the server](messaging-post.md). ```fsharp FileUpload.createFileUpload (HandleFile >> dispatch) diff --git a/docs/v4-recipes/javascript/third-party-react-package.md b/docs/v4-recipes/javascript/third-party-react-package.md index bc20b0f0..29860c78 100644 --- a/docs/v4-recipes/javascript/third-party-react-package.md +++ b/docs/v4-recipes/javascript/third-party-react-package.md @@ -1,7 +1,7 @@ To use a third-party React library in a SAFE application, you need to write an F# wrapper around it. There are two ways for doing this - using [Fable.React](https://www.nuget.org/packages/Fable.React/) or using [Feliz](https://zaid-ajaj.github.io/Feliz/). ## Prerequisites -This recipe uses the [react-d3-speedometer NPM package](https://www.npmjs.com/package/react-d3-speedometer) for demonstration purposes. [Add it to your Client](../../package-management/add-npm-package-to-client) before continuing. +This recipe uses the [react-d3-speedometer NPM package](https://www.npmjs.com/package/react-d3-speedometer) for demonstration purposes. [Add it to your Client](../package-management/add-npm-package-to-client.md) before continuing. ## Fable.React - Setup @@ -57,7 +57,7 @@ reactSpeedometer [ ## Feliz - Setup -If you don't already have [Feliz](https://www.nuget.org/packages/Feliz/) installed, [add it to your client](../../ui/add-feliz). +If you don't already have [Feliz](https://www.nuget.org/packages/Feliz/) installed, [add it to your client](../ui/add-feliz.md). In the Client projects `Index.fs` add the following snippets ```fsharp @@ -85,7 +85,7 @@ As a quick check to ensure that the library is being imported and we have no typ Browser.Dom.console.log("REACT-D3-IMPORT", importDefault "react-d3-speedometer") ``` In the console window (which can be reached by right-clicking and selecting Insepct Element) you should see some output from the above log. -If nothing is being seen you may need a slightly different import statement, [please refer to this recipe](../import-js-module). +If nothing is being seen you may need a slightly different import statement, [please refer to this recipe](import-js-module.md). - `createObj` from `Fable.Core.JsInterop` takes a sequence of `string * obj` which is a prop name and value for the component, you can find the full prop list for react-d3-speedometer [here](https://www.npmjs.com/package/react-d3-speedometer). - Using `==>` (short hand for `prop.custom`) to transform the sequence into a JavaScript object diff --git a/docs/v4-recipes/package-management/add-nuget-package-to-client.md b/docs/v4-recipes/package-management/add-nuget-package-to-client.md index 1b9d0576..bde37044 100644 --- a/docs/v4-recipes/package-management/add-nuget-package-to-client.md +++ b/docs/v4-recipes/package-management/add-nuget-package-to-client.md @@ -1,5 +1,5 @@ # How do I add a NuGet package to the Client? -Adding packages to the Client project is a very [similar process to the Server](../add-nuget-package-to-server), with a few key differences: +Adding packages to the Client project is a very [similar process to the Server](add-nuget-package-to-server.md), with a few key differences: - Any references to the `Server` directory should be `Client` diff --git a/docs/v4-recipes/package-management/add-nuget-package-to-server.md b/docs/v4-recipes/package-management/add-nuget-package-to-server.md index be860634..3634f73b 100644 --- a/docs/v4-recipes/package-management/add-nuget-package-to-server.md +++ b/docs/v4-recipes/package-management/add-nuget-package-to-server.md @@ -16,7 +16,7 @@ dotnet paket add FsToolkit.ErrorHandling -p Server This will add an entry to both the solution [paket.dependencies](https://fsprojects.github.io/Paket/dependencies-file.html) file and the Server project's [paket.reference](https://fsprojects.github.io/Paket/references-files.html) file, as well as update the lock file with the updated dependency graph. -> Find information on how you can convert your project from NuGet to Paket [here](../migrate-to-paket). +> Find information on how you can convert your project from NuGet to Paket [here](migrate-to-paket.md). > > For a detailed explanation of package management using Paket, visit the official [docs](https://fsprojects.github.io/Paket/learn-how-to-use-paket.html). diff --git a/docs/v4-recipes/ui/add-daisyui.md b/docs/v4-recipes/ui/add-daisyui.md index 155f465e..ffdd6616 100644 --- a/docs/v4-recipes/ui/add-daisyui.md +++ b/docs/v4-recipes/ui/add-daisyui.md @@ -2,7 +2,7 @@ [DaisyUI](https://daisyui.com/) is a component library for [Tailwind CSS](https://tailwindcss.com/docs/installation). To use the library from within F# we will use [Feliz.DaisyUI](https://dzoukr.github.io/Feliz.DaisyUI/) ([Github](https://github.com/Dzoukr/Feliz.DaisyUI)). -1. Follow the instructions for how to [add Tailwind CSS to your project](../add-tailwind/) +1. Follow the instructions for how to [add Tailwind CSS to your project](add-tailwind.md) 1. Add daisyUI JS dependencies using NPM: `npm i -D daisyui@latest` diff --git a/docs/v4-recipes/ui/add-tailwind.md b/docs/v4-recipes/ui/add-tailwind.md index 3800a8c1..a66ba9fa 100644 --- a/docs/v4-recipes/ui/add-tailwind.md +++ b/docs/v4-recipes/ui/add-tailwind.md @@ -2,7 +2,7 @@ [Tailwind](https://tailwindcss.com/) is a utility-first CSS framework packed that can be composed to build any design, directly in your markup. -1. [Add a stylesheet](https://safe-stack.github.io/docs/recipes/ui/add-style/) to the project +1. [Add a stylesheet](add-style.md) to the project 2. Install the required npm packages ```shell diff --git a/docs/v4-recipes/ui/cdn-to-npm.md b/docs/v4-recipes/ui/cdn-to-npm.md index c9f6c676..2246b201 100644 --- a/docs/v4-recipes/ui/cdn-to-npm.md +++ b/docs/v4-recipes/ui/cdn-to-npm.md @@ -11,7 +11,7 @@ Find the following line in `src/Client/index.html` and delete it before moving o #### 2. Add the NPM Package Go ahead and add the [Bulma NPM package](https://www.npmjs.com/package/bulma) to your project. -> See: [How do I add an NPM package to the client?](../../package-management/add-npm-package-to-client) +> See: [How do I add an NPM package to the client?](../package-management/add-npm-package-to-client.md) #### 3. Load the Stylesheets There are two ways for loading the stylesheets: @@ -27,7 +27,7 @@ importAll "bulma/bulma.sass" > You can use this approach for any NPM package. ##### b. Using Sass -1. Add a Sass stylesheet to your project using [this recipe](../add-style). +1. Add a Sass stylesheet to your project using [this recipe](add-style.md). 2. Add the following line to your Sass file to bring in Bulma ```sass @import "~bulma/bulma.sass" diff --git a/docs/v4-recipes/ui/use-different-bulma-themes.md b/docs/v4-recipes/ui/use-different-bulma-themes.md index 5025b69c..6e296eaf 100644 --- a/docs/v4-recipes/ui/use-different-bulma-themes.md +++ b/docs/v4-recipes/ui/use-different-bulma-themes.md @@ -24,7 +24,7 @@ In your `index.html`, add the following line anywhere between the opening and cl ``` #### 2. Add Fulma or Feliz.Bulma to the Solution -Read [this recipe](../add-bulma) for the rest of the instructions. +Read [this recipe](add-bulma.md) for the rest of the instructions. --- And that’s it. You should now see your app styled in accordance with the Bulma theme you’ve just switched to. diff --git a/mkdocs.yml b/mkdocs.yml index 1ee9e85a..58829b3b 100644 --- a/mkdocs.yml +++ b/mkdocs.yml @@ -46,24 +46,24 @@ nav: - Quickstart: 'quickstart.md' - SAFE Stack Overview: 'overview.md' - Components of SAFE: - - Learn about Saturn : 'component-saturn.md' - - Learn about Azure : 'component-azure.md' - - Learn about Fable : 'component-fable.md' - - Learn about Elmish : 'component-elmish.md' + - Learn about Saturn : 'components/component-saturn.md' + - Learn about Azure : 'components/component-azure.md' + - Learn about Fable : 'components/component-fable.md' + - Learn about Elmish : 'components/component-elmish.md' - The SAFE Template: - Overview: 'template-overview.md' - Commands: 'template-safe-commands.md' - Features of SAFE: - Client / Server Sharing: - - Sharing Overview : 'feature-clientserver.md' - - Sharing Types and Code : 'feature-clientserver-basics.md' - - Messaging using HTTP : 'feature-clientserver-http.md' - - Messaging with Protocols : 'feature-clientserver-remoting.md' - - Stateful Messaging through Bridge : 'feature-clientserver-bridge.md' - - Serialization in SAFE : 'feature-clientserver-serialization.md' - - Server Side Rendering : 'feature-ssr.md' - - Hot Module Replacement : 'feature-hmr.md' - - Working with Azure functions : 'feature-azurefunctions.md' + - Sharing Overview : 'features/feature-clientserver.md' + - Sharing Types and Code : 'features/feature-clientserver-basics.md' + - Messaging using HTTP : 'features/feature-clientserver-http.md' + - Messaging with Protocols : 'features/feature-clientserver-remoting.md' + - Stateful Messaging through Bridge : 'features/feature-clientserver-bridge.md' + - Serialization in SAFE : 'features/feature-clientserver-serialization.md' + - Server Side Rendering : 'features/feature-ssr.md' + - Hot Module Replacement : 'features/feature-hmr.md' + - Working with Azure functions : 'features/feature-azurefunctions.md' - How do I...: - Upgrade from V2 to V3 : 'recipes/upgrading/v2-to-v3.md' - Upgrade from V3 to V4 : 'recipes/upgrading/v3-to-v4.md' @@ -91,8 +91,8 @@ nav: - Post data to the server: 'recipes/client-server/messaging-post.md' - Share code between the client and the server: 'recipes/client-server/share-code.md' - FAQs: - - Moving from dev to prod : 'faq-build.md' - - Troubleshooting : 'faq-troubleshooting.md' + - Moving from dev to prod : 'faq/faq-build.md' + - Troubleshooting : 'faq/faq-troubleshooting.md' - Learning Resources: - SAFE-Compatible UI Components: 'awesome-safe-components.md' - Learning: 'learning.md' From 6a6d8af36486bc94897ba4089cc3b7d08242c736 Mon Sep 17 00:00:00 2001 From: Rico Saupe <145867813+RicoSaupe@users.noreply.github.com> Date: Sun, 10 Dec 2023 11:01:47 +0100 Subject: [PATCH 2/7] changes all dotnet new -i to install --- mkdocs.yml | 37 +++++++++++++++++++------------------ 1 file changed, 19 insertions(+), 18 deletions(-) diff --git a/mkdocs.yml b/mkdocs.yml index 58829b3b..c6fa0552 100644 --- a/mkdocs.yml +++ b/mkdocs.yml @@ -44,26 +44,27 @@ nav: - Home: 'index.md' - Introduction: 'intro.md' - Quickstart: 'quickstart.md' -- SAFE Stack Overview: 'overview.md' -- Components of SAFE: - - Learn about Saturn : 'components/component-saturn.md' - - Learn about Azure : 'components/component-azure.md' - - Learn about Fable : 'components/component-fable.md' - - Learn about Elmish : 'components/component-elmish.md' -- The SAFE Template: +- SAFE Stack: + - Overview: 'overview.md' + - Components: + - Learn about Saturn : 'components/component-saturn.md' + - Learn about Azure : 'components/component-azure.md' + - Learn about Fable : 'components/component-fable.md' + - Learn about Elmish : 'components/component-elmish.md' + - Features: + - Client / Server Sharing: + - Sharing Overview : 'features/feature-clientserver.md' + - Sharing Types and Code : 'features/feature-clientserver-basics.md' + - Messaging using HTTP : 'features/feature-clientserver-http.md' + - Messaging with Protocols : 'features/feature-clientserver-remoting.md' + - Stateful Messaging through Bridge : 'features/feature-clientserver-bridge.md' + - Serialization in SAFE : 'features/feature-clientserver-serialization.md' + - Server Side Rendering : 'features/feature-ssr.md' + - Hot Module Replacement : 'features/feature-hmr.md' + - Working with Azure functions : 'features/feature-azurefunctions.md' +- SAFE Template: - Overview: 'template-overview.md' - Commands: 'template-safe-commands.md' -- Features of SAFE: - - Client / Server Sharing: - - Sharing Overview : 'features/feature-clientserver.md' - - Sharing Types and Code : 'features/feature-clientserver-basics.md' - - Messaging using HTTP : 'features/feature-clientserver-http.md' - - Messaging with Protocols : 'features/feature-clientserver-remoting.md' - - Stateful Messaging through Bridge : 'features/feature-clientserver-bridge.md' - - Serialization in SAFE : 'features/feature-clientserver-serialization.md' - - Server Side Rendering : 'features/feature-ssr.md' - - Hot Module Replacement : 'features/feature-hmr.md' - - Working with Azure functions : 'features/feature-azurefunctions.md' - How do I...: - Upgrade from V2 to V3 : 'recipes/upgrading/v2-to-v3.md' - Upgrade from V3 to V4 : 'recipes/upgrading/v3-to-v4.md' From 30978741301bc1106aab86a74f6130c4cf7149db Mon Sep 17 00:00:00 2001 From: Rico Saupe <145867813+RicoSaupe@users.noreply.github.com> Date: Sun, 10 Dec 2023 11:04:32 +0100 Subject: [PATCH 3/7] changed rest of dotnet new -i to install --- docs/recipes/upgrading/v2-to-v3.md | 2 +- docs/recipes/upgrading/v3-to-v4.md | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/recipes/upgrading/v2-to-v3.md b/docs/recipes/upgrading/v2-to-v3.md index e0773dd3..411a8b85 100644 --- a/docs/recipes/upgrading/v2-to-v3.md +++ b/docs/recipes/upgrading/v2-to-v3.md @@ -14,7 +14,7 @@ There have been a number of changes between the second and third major versions Download and install the latest SAFE Stack V3 template by running the following command: ```bash -dotnet new -i SAFE.Template::3.1.1 +dotnet new install SAFE.Template::3.1.1 ``` #### 2. Create a v3 project diff --git a/docs/recipes/upgrading/v3-to-v4.md b/docs/recipes/upgrading/v3-to-v4.md index 058a0b42..206a2ac8 100644 --- a/docs/recipes/upgrading/v3-to-v4.md +++ b/docs/recipes/upgrading/v3-to-v4.md @@ -14,7 +14,7 @@ This guide shows you how to upgrade your v3 project to v4. Download and install the latest SAFE Stack V3 template by running the following command: ```bash -dotnet new -i SAFE.Template +dotnet new install SAFE.Template ``` #### 2. Create a v4 project From 9e4401e89939d224910eba7c1246f9565acece6d Mon Sep 17 00:00:00 2001 From: Rico Saupe <145867813+RicoSaupe@users.noreply.github.com> Date: Mon, 18 Dec 2023 15:23:14 +0100 Subject: [PATCH 4/7] changes from upstream --- mkdocs.yml | 176 ++++++++++++++++++++++++++--------------------------- 1 file changed, 88 insertions(+), 88 deletions(-) diff --git a/mkdocs.yml b/mkdocs.yml index c6fa0552..f80caa78 100644 --- a/mkdocs.yml +++ b/mkdocs.yml @@ -8,11 +8,11 @@ site_url: http://safe-stack.github.io/docs/ repo_name: SAFE-Stack/docs repo_url: https://github.com/SAFE-Stack/docs theme: - name: 'material' - custom_dir: 'theme' + name: "material" + custom_dir: "theme" palette: - primary: 'light blue' - accent: 'indigo' + primary: "light blue" + accent: "indigo" logo: img/safe_favicon.png markdown_extensions: @@ -41,111 +41,111 @@ extra: link: https://safe-stack.github.io/ nav: -- Home: 'index.md' -- Introduction: 'intro.md' -- Quickstart: 'quickstart.md' +- Home: "index.md" +- Introduction: "intro.md" +- Quickstart: "quickstart.md" - SAFE Stack: - - Overview: 'overview.md' + - Overview: "overview.md" - Components: - - Learn about Saturn : 'components/component-saturn.md' - - Learn about Azure : 'components/component-azure.md' - - Learn about Fable : 'components/component-fable.md' - - Learn about Elmish : 'components/component-elmish.md' + - Learn about Saturn : "components/component-saturn.md" + - Learn about Azure : "components/component-azure.md" + - Learn about Fable : "components/component-fable.md" + - Learn about Elmish : "components/component-elmish.md" - Features: - Client / Server Sharing: - - Sharing Overview : 'features/feature-clientserver.md' - - Sharing Types and Code : 'features/feature-clientserver-basics.md' - - Messaging using HTTP : 'features/feature-clientserver-http.md' - - Messaging with Protocols : 'features/feature-clientserver-remoting.md' - - Stateful Messaging through Bridge : 'features/feature-clientserver-bridge.md' - - Serialization in SAFE : 'features/feature-clientserver-serialization.md' - - Server Side Rendering : 'features/feature-ssr.md' - - Hot Module Replacement : 'features/feature-hmr.md' - - Working with Azure functions : 'features/feature-azurefunctions.md' + - Sharing Overview : "features/feature-clientserver.md" + - Sharing Types and Code : "features/feature-clientserver-basics.md" + - Messaging using HTTP : "features/feature-clientserver-http.md" + - Messaging with Protocols : "features/feature-clientserver-remoting.md" + - Stateful Messaging through Bridge : "features/feature-clientserver-bridge.md" + - Serialization in SAFE : "features/feature-clientserver-serialization.md" + - Server Side Rendering : "features/feature-ssr.md" + - Hot Module Replacement : "features/feature-hmr.md" + - Working with Azure functions : "features/feature-azurefunctions.md" - SAFE Template: - - Overview: 'template-overview.md' - - Commands: 'template-safe-commands.md' + - Overview: "template-overview.md" + - Commands: "template-safe-commands.md" - How do I...: - - Upgrade from V2 to V3 : 'recipes/upgrading/v2-to-v3.md' - - Upgrade from V3 to V4 : 'recipes/upgrading/v3-to-v4.md' - - Upgrade from V4 to V5 : 'recipes/upgrading/v4-to-v5.md' - - Create a new Recipe: 'recipes/template.md' + - Upgrade from V2 to V3 : "recipes/upgrading/v2-to-v3.md" + - Upgrade from V3 to V4 : "recipes/upgrading/v3-to-v4.md" + - Upgrade from V4 to V5 : "recipes/upgrading/v4-to-v5.md" + - Create a new Recipe: "recipes/template.md" - UI: - - Add daisyUI support: 'recipes/ui/add-daisyui.md' + - Add daisyUI support: "recipes/ui/add-daisyui.md" - JavaScript: - - Import a JavaScript module: 'recipes/javascript/import-js-module.md' - - Add Support for a Third Party React Library: 'recipes/javascript/third-party-react-package.md' + - Import a JavaScript module: "recipes/javascript/import-js-module.md" + - Add Support for a Third Party React Library: "recipes/javascript/third-party-react-package.md" - Package Management: - - Add an NPM package to the Client: 'recipes/package-management/add-npm-package-to-client.md' - - Add a NuGet package to the Server: 'recipes/package-management/add-nuget-package-to-server.md' - - Migrate to Paket from NuGet: 'recipes/package-management/migrate-to-paket.md' - - Migrate to NuGet from Paket: 'recipes/package-management/migrate-to-nuget.md' - - Sync NuGet and NPM Packages: 'recipes/package-management/sync-nuget-and-npm-packages.md' + - Add an NPM package to the Client: "recipes/package-management/add-npm-package-to-client.md" + - Add a NuGet package to the Server: "recipes/package-management/add-nuget-package-to-server.md" + - Migrate to Paket from NuGet: "recipes/package-management/migrate-to-paket.md" + - Migrate to NuGet from Paket: "recipes/package-management/migrate-to-nuget.md" + - Sync NuGet and NPM Packages: "recipes/package-management/sync-nuget-and-npm-packages.md" - Client / Server: - Use Giraffe instead of Saturn: "recipes/client-server/saturn-to-giraffe.md" - - Handle server errors on the client: 'recipes/client-server/server-errors-on-client.md' + - Handle server errors on the client: "recipes/client-server/server-errors-on-client.md" - Upload file from the client: "recipes/client-server/upload-file-from-client.md" - - Serve a file from the back-end: 'recipes/client-server/serve-a-file-from-the-backend.md' - - Add support for Fable Remoting: 'recipes/client-server/fable-remoting.md' - - Perform roundtrips with MVU: 'recipes/client-server/mvu-roundtrip.md' - - Get data from the server: 'recipes/client-server/messaging.md' - - Post data to the server: 'recipes/client-server/messaging-post.md' - - Share code between the client and the server: 'recipes/client-server/share-code.md' + - Serve a file from the back-end: "recipes/client-server/serve-a-file-from-the-backend.md" + - Add support for Fable Remoting: "recipes/client-server/fable-remoting.md" + - Perform roundtrips with MVU: "recipes/client-server/mvu-roundtrip.md" + - Get data from the server: "recipes/client-server/messaging.md" + - Post data to the server: "recipes/client-server/messaging-post.md" + - Share code between the client and the server: "recipes/client-server/share-code.md" - FAQs: - - Moving from dev to prod : 'faq/faq-build.md' - - Troubleshooting : 'faq/faq-troubleshooting.md' + - Moving from dev to prod : "faq/faq-build.md" + - Troubleshooting : "faq/faq-troubleshooting.md" - Learning Resources: - - SAFE-Compatible UI Components: 'awesome-safe-components.md' - - Learning: 'learning.md' -- News: 'news.md' -- Events: 'events.md' -- Support: 'support.md' -- Testimonials: 'testimonials.md' + - SAFE-Compatible UI Components: "awesome-safe-components.md" + - Learning: "learning.md" +- News: "news.md" +- Events: "events.md" +- Support: "support.md" +- Testimonials: "testimonials.md" - Legacy recipes (v4): - Build: - - Add build automation: 'v4-recipes/build/add-build-script.md' - - Remove FAKE: 'v4-recipes/build/remove-fake.md' - - Package my SAFE app for deployment: 'v4-recipes/build/bundle-app.md' - - Create a docker image: 'v4-recipes/build/docker-image.md' + - Add build automation: "v4-recipes/build/add-build-script.md" + - Remove FAKE: "v4-recipes/build/remove-fake.md" + - Package my SAFE app for deployment: "v4-recipes/build/bundle-app.md" + - Create a docker image: "v4-recipes/build/docker-image.md" - Dev / Test: - - Test the Client: 'v4-recipes/developing-and-testing/testing-the-client.md' - - Test the Server: 'v4-recipes/developing-and-testing/testing-the-server.md' - - Debug a SAFE app: 'v4-recipes/developing-and-testing/debug-safe-app.md' - - Use hot reload: 'v4-recipes/developing-and-testing/using-hot-reload.md' + - Test the Client: "v4-recipes/developing-and-testing/testing-the-client.md" + - Test the Server: "v4-recipes/developing-and-testing/testing-the-server.md" + - Debug a SAFE app: "v4-recipes/developing-and-testing/debug-safe-app.md" + - Use hot reload: "v4-recipes/developing-and-testing/using-hot-reload.md" - Client / Server: - - Add support for Fable Remoting: 'v4-recipes/client-server/fable-remoting.md' - - Perform roundtrips with MVU: 'v4-recipes/client-server/mvu-roundtrip.md' - - Get data from the server: 'v4-recipes/client-server/messaging.md' - - Post data to the server: 'v4-recipes/client-server/messaging-post.md' - - Handle server errors on the client: 'v4-recipes/client-server/server-errors-on-client.md' - - Share code between the client and the server: 'v4-recipes/client-server/share-code.md' + - Add support for Fable Remoting: "v4-recipes/client-server/fable-remoting.md" + - Perform roundtrips with MVU: "v4-recipes/client-server/mvu-roundtrip.md" + - Get data from the server: "v4-recipes/client-server/messaging.md" + - Post data to the server: "v4-recipes/client-server/messaging-post.md" + - Handle server errors on the client: "v4-recipes/client-server/server-errors-on-client.md" + - Share code between the client and the server: "v4-recipes/client-server/share-code.md" - Use Giraffe instead of Saturn: "v4-recipes/client-server/saturn-to-giraffe.md" - Upload file from the client: "v4-recipes/client-server/upload-file-from-client.md" - - Serve a file from the back-end: 'v4-recipes/client-server/serve-a-file-from-the-backend.md' - - Add support for Fable.Forms: 'v4-recipes/client-server/fable.forms.md' + - Serve a file from the back-end: "v4-recipes/client-server/serve-a-file-from-the-backend.md" + - Add support for Fable.Forms: "v4-recipes/client-server/fable.forms.md" - Data: - - Quickly add a database: 'v4-recipes/storage/use-litedb.md' - - Create a data module using SQLProvider SQL Server SSDT: 'v4-recipes/storage/use-sqlprovider-ssdt.md' + - Quickly add a database: "v4-recipes/storage/use-litedb.md" + - Create a data module using SQLProvider SQL Server SSDT: "v4-recipes/storage/use-sqlprovider-ssdt.md" - UI: - - Add FontAwesome support: 'v4-recipes/ui/add-fontawesome.md' - - Add Stylesheet support: 'v4-recipes/ui/add-style.md' - - Add Bulma support: 'v4-recipes/ui/add-bulma.md' - - Use different Bulma Themes: 'v4-recipes/ui/use-different-bulma-themes.md' - - Remove Bulma: 'v4-recipes/ui/remove-bulma.md' - - Add Tailwind support: 'v4-recipes/ui/add-tailwind.md' - - Add daisyUI support: 'v4-recipes/ui/add-daisyui.md' - - Add Feliz support: 'v4-recipes/ui/add-feliz.md' - - Migrate from a CDN stylesheet to an NPM package: 'v4-recipes/ui/cdn-to-npm.md' - - Add routing with state shared between pages: 'v4-recipes/ui/add-routing.md' - - Add routing with separate models per page: 'v4-recipes/ui/add-routing-with-separate-models.md' - - Add Routing with UseElmish: 'v4-recipes/ui/routing-with-elmish.md' + - Add FontAwesome support: "v4-recipes/ui/add-fontawesome.md" + - Add Stylesheet support: "v4-recipes/ui/add-style.md" + - Add Bulma support: "v4-recipes/ui/add-bulma.md" + - Use different Bulma Themes: "v4-recipes/ui/use-different-bulma-themes.md" + - Remove Bulma: "v4-recipes/ui/remove-bulma.md" + - Add Tailwind support: "v4-recipes/ui/add-tailwind.md" + - Add daisyUI support: "v4-recipes/ui/add-daisyui.md" + - Add Feliz support: "v4-recipes/ui/add-feliz.md" + - Migrate from a CDN stylesheet to an NPM package: "v4-recipes/ui/cdn-to-npm.md" + - Add routing with state shared between pages: "v4-recipes/ui/add-routing.md" + - Add routing with separate models per page: "v4-recipes/ui/add-routing-with-separate-models.md" + - Add Routing with UseElmish: "v4-recipes/ui/routing-with-elmish.md" - JavaScript: - - Import a JavaScript module: 'v4-recipes/javascript/import-js-module.md' - - Add Support for a Third Party React Library: 'v4-recipes/javascript/third-party-react-package.md' + - Import a JavaScript module: "v4-recipes/javascript/import-js-module.md" + - Add Support for a Third Party React Library: "v4-recipes/javascript/third-party-react-package.md" - Package Management: - - Add an NPM package to the Client: 'v4-recipes/package-management/add-npm-package-to-client.md' - - Add a NuGet package to the Server: 'v4-recipes/package-management/add-nuget-package-to-server.md' - - Add a NuGet package to the Client: 'v4-recipes/package-management/add-nuget-package-to-client.md' - - Migrate to Paket from NuGet: 'v4-recipes/package-management/migrate-to-paket.md' - - Migrate to NuGet from Paket: 'v4-recipes/package-management/migrate-to-nuget.md' - - Sync NuGet and NPM Packages: 'v4-recipes/package-management/sync-nuget-and-npm-packages.md' \ No newline at end of file + - Add an NPM package to the Client: "v4-recipes/package-management/add-npm-package-to-client.md" + - Add a NuGet package to the Server: "v4-recipes/package-management/add-nuget-package-to-server.md" + - Add a NuGet package to the Client: "v4-recipes/package-management/add-nuget-package-to-client.md" + - Migrate to Paket from NuGet: "v4-recipes/package-management/migrate-to-paket.md" + - Migrate to NuGet from Paket: "v4-recipes/package-management/migrate-to-nuget.md" + - Sync NuGet and NPM Packages: "v4-recipes/package-management/sync-nuget-and-npm-packages.md" \ No newline at end of file From e6cfb778daa6a583c9442d7b2f45093551247f1c Mon Sep 17 00:00:00 2001 From: Rico Saupe <145867813+RicoSaupe@users.noreply.github.com> Date: Mon, 18 Dec 2023 18:06:20 +0100 Subject: [PATCH 5/7] fixed links that came in from last master merge --- docs/recipes/build/add-build-script.md | 2 +- docs/recipes/build/bundle-app.md | 6 +++--- docs/recipes/build/remove-fake.md | 4 ++-- docs/recipes/javascript/third-party-react-package.md | 2 +- .../package-management/add-nuget-package-to-client.md | 2 +- docs/recipes/ui/cdn-to-npm.md | 4 ++-- docs/v4-recipes/javascript/third-party-react-package.md | 2 +- mkdocs.yml | 9 +++------ 8 files changed, 14 insertions(+), 17 deletions(-) diff --git a/docs/recipes/build/add-build-script.md b/docs/recipes/build/add-build-script.md index 1d7489ed..799580f7 100644 --- a/docs/recipes/build/add-build-script.md +++ b/docs/recipes/build/add-build-script.md @@ -3,7 +3,7 @@ ## FAKE [Fake](https://fake.build/) is a DSL for build tasks that is modular, extensible and easy to start with. Fake allows you to easily build, bundle, deploy your app and more by executing a single command. -> The standard template comes [with a FAKE project](../../../template-safe-commands) by default, so **this recipe only applies to the minimal template**. +> The standard template comes [with a FAKE project](../../template-safe-commands.md) by default, so **this recipe only applies to the minimal template**. --- #### 1. Create a build project diff --git a/docs/recipes/build/bundle-app.md b/docs/recipes/build/bundle-app.md index 64998cd0..7a75c00f 100644 --- a/docs/recipes/build/bundle-app.md +++ b/docs/recipes/build/bundle-app.md @@ -1,6 +1,6 @@ # How do I bundle my SAFE application? -When developing your SAFE application, the local runtime experience uses Vite to run the client and redirect API calls to the server on a [different port](../../../faq-build). However, when you *deploy* your application, you'll need to run your Saturn server which will serve up statically-built client resources (HTML, JavaScript, CSS etc.). +When developing your SAFE application, the local runtime experience uses Vite to run the client and redirect API calls to the server on a [different port](../../faq/faq-build.md). However, when you *deploy* your application, you'll need to run your Saturn server which will serve up statically-built client resources (HTML, JavaScript, CSS etc.). #### 1. Run the FAKE script If you created your SAFE app using the recommended defaults, your application already has a FAKE script which will do the bundling for you. You can create a bundle using the following command: @@ -11,7 +11,7 @@ dotnet run Bundle This will build and package up both the client and server and place them into the `/deploy` folder at the root of the repository. -> See [here](../../../template-safe-commands) for more details on this build target. +> See [here](../../template-safe-commands.md) for more details on this build target. ## Testing the bundle 1. Navigate to the `deploy` folder at the root of your repository. @@ -21,4 +21,4 @@ This will build and package up both the client and server and place them into th You should now see your SAFE application. ## Further reading -See [this article](/docs/faq-build) for more information on architectural concerns regarding the move from dev to production and bundling SAFE Stack applications. +See [this article](../../faq/faq-build.md) for more information on architectural concerns regarding the move from dev to production and bundling SAFE Stack applications. diff --git a/docs/recipes/build/remove-fake.md b/docs/recipes/build/remove-fake.md index 8dea9372..1533b715 100644 --- a/docs/recipes/build/remove-fake.md +++ b/docs/recipes/build/remove-fake.md @@ -1,5 +1,5 @@ # How do I remove the use of FAKE? -[FAKE](https://fake.build/) is a tool for build automation. The standard SAFE template comes with a [ready-made build project](../../../template-safe-commands) at the root of the solution that provides support for many common SAFE tasks. +[FAKE](https://fake.build/) is a tool for build automation. The standard SAFE template comes with a [ready-made build project](../../template-safe-commands.md) at the root of the solution that provides support for many common SAFE tasks. If you would prefer not to use FAKE, you can of course simply ignore it, but this recipes shows how to completely remove it from your repository. It is important to note that having removed FAKE, you will have to follow a more manual approach to each of these processes. This recipe will only include instructions on how to run the application after removing FAKE. @@ -36,6 +36,6 @@ dotnet fable watch -o output -s --run npx vite The app will now be running at `http://localhost:8080/`. Navigate to this address in a browser to see your app running. ## Bundling the App -See [this guide](../build/bundle-app.md#2-im-using-the-minimal-template) to learn how to package a SAFE application for deployment to e.g. Azure. +See [this guide](bundle-app.md#2-im-using-the-minimal-template) to learn how to package a SAFE application for deployment to e.g. Azure. --- diff --git a/docs/recipes/javascript/third-party-react-package.md b/docs/recipes/javascript/third-party-react-package.md index 56dde40d..67859f6e 100644 --- a/docs/recipes/javascript/third-party-react-package.md +++ b/docs/recipes/javascript/third-party-react-package.md @@ -57,7 +57,7 @@ reactSpeedometer [ ## Feliz - Setup -If you don't already have [Feliz](https://www.nuget.org/packages/Feliz/) installed, [add it to your client](../../v4-recipes/ui/add-feliz.md). +If you don't already have [Feliz](https://www.nuget.org/packages/Feliz/) installed, [add it to your client](../ui/add-feliz.md). In the Client projects `Index.fs` add the following snippets ```fsharp diff --git a/docs/recipes/package-management/add-nuget-package-to-client.md b/docs/recipes/package-management/add-nuget-package-to-client.md index 1b9d0576..bde37044 100644 --- a/docs/recipes/package-management/add-nuget-package-to-client.md +++ b/docs/recipes/package-management/add-nuget-package-to-client.md @@ -1,5 +1,5 @@ # How do I add a NuGet package to the Client? -Adding packages to the Client project is a very [similar process to the Server](../add-nuget-package-to-server), with a few key differences: +Adding packages to the Client project is a very [similar process to the Server](add-nuget-package-to-server.md), with a few key differences: - Any references to the `Server` directory should be `Client` diff --git a/docs/recipes/ui/cdn-to-npm.md b/docs/recipes/ui/cdn-to-npm.md index 7bb2aea2..f3df7c1a 100644 --- a/docs/recipes/ui/cdn-to-npm.md +++ b/docs/recipes/ui/cdn-to-npm.md @@ -9,11 +9,11 @@ Remove the CDN reference from the index template in `src/Client/index.html`: ``` #### 2. Add the NPM Package -Add styles from NPM. [How do I add an NPM package to the client?](../../package-management/add-npm-package-to-client) +Add styles from NPM. [How do I add an NPM package to the client?](../package-management/add-npm-package-to-client.md) In this example we will add the [Bulma NPM package](https://www.npmjs.com/package/bulma). #### 3. Add a reference to your stylesheet -1. Add a stylesheet to your project using [this recipe](../add-style). Add a scss file instead of a css file. +1. Add a stylesheet to your project using [this recipe](add-style.md). Add a scss file instead of a css file. 1. Add the following lines to your scss file: ```scss // Set variables to affect Bulma styles diff --git a/docs/v4-recipes/javascript/third-party-react-package.md b/docs/v4-recipes/javascript/third-party-react-package.md index 29860c78..cfbb2d90 100644 --- a/docs/v4-recipes/javascript/third-party-react-package.md +++ b/docs/v4-recipes/javascript/third-party-react-package.md @@ -57,7 +57,7 @@ reactSpeedometer [ ## Feliz - Setup -If you don't already have [Feliz](https://www.nuget.org/packages/Feliz/) installed, [add it to your client](../ui/add-feliz.md). +If you don't already have [Feliz](https://www.nuget.org/packages/Feliz/) installed, [add it to your client](../../recipes/ui/add-feliz.md). In the Client projects `Index.fs` add the following snippets ```fsharp diff --git a/mkdocs.yml b/mkdocs.yml index 9e0c83e6..5df56284 100644 --- a/mkdocs.yml +++ b/mkdocs.yml @@ -65,9 +65,6 @@ nav: - Server Side Rendering : "features/feature-ssr.md" - Hot Module Replacement : "features/feature-hmr.md" - Working with Azure functions : "features/feature-azurefunctions.md" - - Server Side Rendering : "feature-ssr.md" - - Hot Module Replacement : "feature-hmr.md" - - Working with Azure functions : "feature-azurefunctions.md" - How do I...: - Upgrade from V2 to V3 : "recipes/upgrading/v2-to-v3.md" - Upgrade from V3 to V4 : "recipes/upgrading/v3-to-v4.md" @@ -108,8 +105,8 @@ nav: - Post data to the server: "recipes/client-server/messaging-post.md" - Share code between the client and the server: "recipes/client-server/share-code.md" - FAQs: - - Moving from dev to prod : "faq-build.md" - - Troubleshooting : "faq-troubleshooting.md" + - Moving from dev to prod : "faq/faq-build.md" + - Troubleshooting : "faq/faq-troubleshooting.md" - Learning Resources: - SAFE-Compatible UI Components: "awesome-safe-components.md" - Learning: "learning.md" @@ -150,7 +147,7 @@ nav: - Remove Bulma: "v4-recipes/ui/remove-bulma.md" - Add Tailwind support: "v4-recipes/ui/add-tailwind.md" - Add daisyUI support: "v4-recipes/ui/add-daisyui.md" - - Add Feliz support: "v4-recipes/ui/add-feliz.md" + - Add Feliz support: "recipes/ui/add-feliz.md" - Migrate from a CDN stylesheet to an NPM package: "v4-recipes/ui/cdn-to-npm.md" - Add routing with state shared between pages: "v4-recipes/ui/add-routing.md" - Add routing with separate models per page: "v4-recipes/ui/add-routing-with-separate-models.md" From 0455bdc0b4dd92c826856db3147733fa137e37d2 Mon Sep 17 00:00:00 2001 From: Rico Saupe <145867813+RicoSaupe@users.noreply.github.com> Date: Mon, 18 Dec 2023 20:18:21 +0100 Subject: [PATCH 6/7] fixed features hierarchy --- mkdocs.yml | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/mkdocs.yml b/mkdocs.yml index 5df56284..f2595757 100644 --- a/mkdocs.yml +++ b/mkdocs.yml @@ -51,9 +51,6 @@ nav: - Learn about Azure : "components/component-azure.md" - Learn about Fable : "components/component-fable.md" - Learn about Elmish : "components/component-elmish.md" -- The SAFE Template: - - Overview: "template-overview.md" - - Commands: "template-safe-commands.md" - Features: - Client / Server Sharing: - Sharing Overview : "features/feature-clientserver.md" @@ -65,6 +62,9 @@ nav: - Server Side Rendering : "features/feature-ssr.md" - Hot Module Replacement : "features/feature-hmr.md" - Working with Azure functions : "features/feature-azurefunctions.md" +- The SAFE Template: + - Overview: "template-overview.md" + - Commands: "template-safe-commands.md" - How do I...: - Upgrade from V2 to V3 : "recipes/upgrading/v2-to-v3.md" - Upgrade from V3 to V4 : "recipes/upgrading/v3-to-v4.md" From 3db012f837cd12659834d55dbf5e39ddcd31eb59 Mon Sep 17 00:00:00 2001 From: Rico Saupe <145867813+RicoSaupe@users.noreply.github.com> Date: Mon, 18 Dec 2023 20:32:57 +0100 Subject: [PATCH 7/7] updated mermaid to latest version --- mkdocs.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/mkdocs.yml b/mkdocs.yml index f2595757..17da9ea2 100644 --- a/mkdocs.yml +++ b/mkdocs.yml @@ -29,7 +29,7 @@ markdown_extensions: extra_css: - https://unpkg.com/mermaid@8.7.0/dist/mermaid.css extra_javascript: - - https://unpkg.com/mermaid@8.7.0/dist/mermaid.min.js + - https://unpkg.com/mermaid@10.6.1/dist/mermaid.min.js extra: social: