Chore/cleanup before open source (#55)

* Chore: Cleanup * Updated some urls to images and removed parts of documentation that is no longer valid * Removal of some documentation that is no longer valid * Removed PDF Export module --------- Co-authored-by: Johan Olsson <[email protected]>
noodlapp · Jan 15, 2024 · 05a7b2b · 05a7b2b
1 parent 656e5fc
commit 05a7b2b
Show file tree

Hide file tree

Showing 36 changed files with 144 additions and 511 deletions.
diff --git a/docs/getting-started/ai-assisted-dev/chat-gpt.md b/docs/getting-started/ai-assisted-dev/chat-gpt.md
@@ -159,4 +159,4 @@ In the same way we can easily ask follow-up questions:
 
 ## Age of exploration
 
-While a lot is known about ChatGPT, there are still a lot of dark spots on the AI-map. New strategies, primers, tips and tricks are invented and uncovered every day. If you have found something that we havent touched upon here and feel like sharing it, please hop on in to the #chat-gpt channel on our [Discord server](https://discord.com/invite/23xU2hYrSJ). Exploration is more fun together, and we all stand on the shoulders of each other in this exciting new step within technology.
+While a lot is known about ChatGPT, there are still a lot of dark spots on the AI-map. New strategies, primers, tips and tricks are invented and uncovered every day. If you have found something that we havent touched upon here and feel like sharing it, please hop on in to the #chat-gpt channel on the [Discord server](https://discord.com/invite/23xU2hYrSJ). Exploration is more fun together, and we all stand on the shoulders of each other in this exciting new step within technology.
diff --git a/docs/getting-started/ai-assisted-dev/overview.md b/docs/getting-started/ai-assisted-dev/overview.md
@@ -4,4 +4,4 @@ hide_title: true
 
 # AI Assisted Development
 
-Noodl is a low code web app builder that will have you creating applications faster and smarter. Even though Noodl is technically a low code tool you can reduce the majority of coding using ChatGPT, making it much more accessible to no coders. Here we collect guides that target the different parts of Noodl where code is required and show you how to use ChatGPT to fill in the blanks. We are comitted to making Noodl accessible to no-coders without reducing the power and capabilities.
+Noodl is a low code web app builder that will have you creating applications faster and smarter. Even though Noodl is technically a low code tool you can reduce the majority of coding using ChatGPT, making it much more accessible to no coders. Here is a collection of guides that target the different parts of Noodl where code is required and shows you how to use ChatGPT to fill in the blanks.
diff --git a/docs/getting-started/fundamentals.md b/docs/getting-started/fundamentals.md
@@ -13,13 +13,13 @@ Here you will learn about a few fundamental concepts in Noodl that are important
 
 ## Nodes
 
-The main building blocks of Noodl are nodes. Every node has its own specific purpose and is very simple in itself, but together they become really powerful. There are a number of types of nodes, indicated by its color. **Blue** nodes are visual elements, such as buttons, or not immediately visible but related, such as groups. **Green** nodes are generally related to reading, writing and manipulating data. **Grey** nodes are utilities, and **Pink** nodes are related to business logic and Javascript.
+The main building blocks of Noodl are nodes. Every node has its own specific purpose and is very simple in itself, but together they become really powerful. There are a number of types of nodes, indicated by its color. **Blue** nodes are visual elements, such as buttons, or not immediately visible but related, such as groups. **Green** nodes are generally related to reading, writing and manipulating data. **Grey** nodes are utilities, and **Pink** nodes are related to custom code.
 
 ![](/docs/getting-started/basic-concepts/nodes.png)
 
 ### Inputs and outputs
 
-All nodes have inputs and outputs. Connecting two nodes is as easy as clicking one node, dragging the connection to another node and selecting what output should be connected to what input. You can visually see the data flow in the Node Editor, and clicking a connection allows you to see what data is being passed.
+All nodes have inputs and outputs. Connecting two nodes is as easy as clicking one node, dragging the connection to another node and selecting what output should be connected to what input. You can visually see the data flow in the Node Graph, and clicking a connection allows you to see what data is being passed.
 
 ![](/docs/getting-started/basic-concepts/connecting-nodes.gif)
 
@@ -29,31 +29,31 @@ Most properties in Noodl can be connected, that's what makes it so powerful and
 
 Noodl has two different connection types, <span className="ndl-data">Data</span> and <span className="ndl-signal">Signals</span>.
 
--   <span className="ndl-data">Data</span>: This connects an output value from one node, such as the content of a Text Input or a Variable, to an input of another node. This is typically used to present data in your user interface. When data is passed over a connection you will see it light up in the node graph editor.
+- <span className="ndl-data">Data</span>: This connects an output value from one node, such as the content of a Text Input or a Variable, to an input of another node. This is typically used to present data in your user interface. When data is passed over a connection you will see it light up in the Node Graph.
 
--   <span className="ndl-signal">Signal</span>: Whenever we want our app to perform some kind of action we use a Signal connection. This connects a signal output, a node can have several signal outputs that each will trigger on a specific event, e.g. Click on a button, to a signal input on another node. The receiving node will typically be some kind of action that is peformed when the signal is received. When a signal is triggered you will see it light up in the node grap editor.
+- <span className="ndl-signal">Signal</span>: Whenever we want our app to perform some kind of action we use a Signal connection. A node can have several signal outputs that each will trigger on a specific event, e.g. Click on a button, to a signal input on another node. The receiving node will typically be some kind of action that is peformed when the signal is received. When a signal is triggered you will see it light up in the Node Graph.
 
 ### Type conversion
 
 You can not connect <span className="ndl-data">Data</span> and <span className="ndl-signal">Signals</span> directly to one another, but there are nodes that can convert the connection types, for example if you want to trigger a signal whenever a value changes.
 
 ## Components
 
-A clusters of nodes and connections, "node graph", and make up a component. These components can then be combined in new node graphs and be part of even larger components. For a larger app, you typically create many different components to keep your application organised. These components can have their own inputs and outputs, just like the built in nodes. This is a great way of reusing UI or logic across your application.
+You can group your clusters of nodes and connections into components. These components can then be combined in new node graphs and be part of even larger components. For a larger app, you typically create many different components to keep your application organised. These components can have their own inputs and outputs, just like the built in nodes. This is a great way of reusing UI or logic across your application.
 
-Component is also a great way to abstract and encapsulate complex functionality. You can decide what properties a component has and that are exposed the outer world, sort of like an API.
+Components are also a great way to abstract and encapsulate complex functionality. You can decide what properties a component has and that are exposed the outer world, sort of like an API.
 
 ### Component types
 
 There are four types of components: Page, Visual, Logic and Cloud Function.
 
--   `Page`: Page components are your app’s screens and can be navigated to using Page Router nodes.
+- `Page`: Page components are your app’s screens and can be navigated to using Page Router nodes.
 
--   `Visual`: Visual components are made to group and render your UI elements on the screen. They can contain logic, but the main output is always something visible.
+- `Visual`: Visual components are made to group and render your UI elements on the screen. They can contain logic, but the main output is always something visible.
 
--   `Logic`: Logic components are the brains of your app. They are used to group nodes that don’t render anything on screen. It can be as simple as a couple of nodes that do data transformation to something more complex, like routing signals to different outputs based on passed values.
+- `Logic`: Logic components are the brains of your app. They are used to group nodes that don’t render anything on the screen. It can be as simple as a couple of nodes that do data transformation to something more complex, like routing signals to different outputs based on passed values.
 
--  `Cloud Function`: A cloud function component is a logic component that run in the cloud. It can do tasks that cannot be done on the frontend and may contain other logic components.
+- `Cloud Function`: A cloud function component is a logic component that run in the cloud, and work with data. It can do tasks that cannot be done on the frontend and may contain other logic components.
 
 ### Update everywhere
 

diff --git a/docs/getting-started/noodl-ai.md b/docs/getting-started/noodl-ai.md
@@ -15,48 +15,30 @@ Noodl AI presents a unique way of leveraging the power of Large Language Models
 
 Easily create JavaScript logic, handle API calls, interact with databases, and generate UI elements. Our goal is to make the development process more inclusive and accessible for a bigger range of skill sets. Whether you're an experienced developer or a beginner, Noodl AI is here to support you throughout your app development journey.
 
-> In the ever-evolving field of generative AI, Noodl AI keeps pace with the latest developments as well as the valuable feedback from the Noodl community. Please don’t hesitate to reach out with your thoughts on our [Discord](https://discord.com/invite/23xU2hYrSJ) or [Twitter](https://twitter.com/getnoodl).
-
 ## Noodl AI access
 
-All Noodl users have access to the beta version of Noodl AI, which includes generative features powered by OpenAIs GPT. However, as these models come with associated costs, we have divided the Noodl AI beta into two modes:
+Noodl AI is built on top of OpenAIs GPT models, and requires you to input an OpenAI API key. It currently supports two modes:
 
-**Limited Beta** is free for all users and is based on GPT-3.5. As this model is not as advanced as GPT-4, this mode only supports very limited AI features.
+- **GPT-3.5**: As this model is not as advanced as GPT-4, this mode only supports very limited AI features.
 
-**Full Beta** is based on GPT-4 and requires you to input a GPT-4 API key from OpenAI. This AI mode includes all generative features, and provides significantly better results.
+- **GPT-4**: This AI mode includes all generative features, and provides significantly better results.
 
 :::note
-Please note that the performance of the same AI command varies between the two modes due to the different capabilities of the GPT versions. For the best results, we recommend using the Full Beta mode, as it gives you a better output.
+Please note that the performance of the same AI command varies between the two modes due to the different capabilities of the GPT versions. For the best results, we recommend using the GPT-4 mode, as it gives you a better output.
 :::
 
-### LLM agnostic
-
-To streamline the beta phase, the public version of Noodl AI is limited to GPT-3.5/4. However, Noodl is built to leverage custom LLM endpoints, and even different models for compliance, regulations, performance, or price concerns.
-
-> We are currently looking for teams willing to test custom solutions. Please contact us of you are interested in using another LLM, custom endpoint, or your own knowledge base.
-
 ## Setup Instructions
 
-Any version of the editor that is version 2.9 or higher comes with the generative features enabled. You can see your current version during login, or in the top right corner of the editor. If your editor has not automatically updated to the latest version, visit the [Noodl Console](https://console.noodl.net) to download it manually.
+Any version of the editor that is version 2.9 or higher comes with the generative features enabled. You can see your current version during login, or in the top right corner of the editor.
 
-When opening a project you should see the AI bar in the top left corner of the node canvas. In the Editor Settings (in the Sidepanel) you can find options for changing the beta mode, or disabling all AI features.
+When opening a project you should see the AI bar in the top left corner of the node canvas. In the Editor Settings (in the Sidepanel) you can find options for changing the AI model, or disabling all AI features.
 
 <div className="ndl-image-with-background l">
 
 ![](/docs/getting-started/noodl-ai/settings.png)
 
 </div>
 
-### Limited Beta
-
-The Limited Beta mode is activated by default and is free to use for everyone. It is built on top of OpenAIs GPT-3.5 model. Due to the limitations of GPT-3.5 we only support the `/Function` command in this mode.
-
-### Full Beta
-
-The Full Beta mode requires an GPT-4 API key from OpenAI. If you don’t have a GPT-4 API key you can request one from OpenAI (but there might be a waiting list). Noodl will not charge you for using the Full Beta, but Open AI will bill you their regular amount based on your API usage.
-
-To activate the Full Beta, open the Editor Settings, find the **Noodl AI (Beta)** settings, and change the mode to `Full beta (gpt-4)`. Enter the API key and click **Verify** to activate.
-
 ## AI commands
 
 When using Noodl AI, start by choosing the type of command you want to work with. This helps the AI generate the best possible result. Behind the scenes, the command sets up the AI with the relevant context and project information, allowing it to perform its task effectively.
@@ -149,7 +131,7 @@ Here are some examples of prompting the `/Write to database` command:
 </div>
 
 :::note
-This is an experimental command and is still both limited and unpolished. Please reach out to us if you have any thoughts on future developments.
+This is an experimental command and is still both limited and unpolished.
 :::
 
 The `/UI` command is used to generate visual nodes from a text prompt. Currently it supports the Group, Columns, Button, Text Input, Checkbox, Image and Dropdown nodes, with some limited styling. It can also generate components from your design system, if they are AI annotated.
@@ -178,8 +160,6 @@ The `/UI` command will now consider your component when generating prompted layo
 
 This method allows you fine grained control over your design system, while still leveraging the capabilities of LLMs for the bigger picture, giving you useful (and reusable) results in a real world setting.
 
-> We are currently looking for teams willing to test AI annotations on their design systems. Please contact us of you are interested in UI generation with your medium/large component library.
-
 ### `/Image`
 
 <div className="ndl-image-with-background l">
@@ -189,16 +169,10 @@ This method allows you fine grained control over your design system, while still
 </div>
 
 :::note
-This is an experimental command and is still both limited and unpolished. Please reach out to us if you have any thoughts on future developments.
+This is an experimental command and is still both limited and unpolished.
 :::
 
 The `/Image` command creates a single Image node and populates it with a Dall-E generated image. The images are saved in the project folder.
 
 > All your prompts will be sent to OpenAI. This includes any AI annotations in your components, as well as your data models (but not any of the data in your database). However, this will not be used to train OpenAIs models.<br/><br/>
 > You can read more about OpenAIs data usage policy [here](https://openai.com/policies/api-data-usage-policies).
-
-## Make your voice heard!
-
-We strongly believe that our community is one of our greatest assets, and we value all the input and feedback that we get, as it helps us shape and steer our development efforts. That's why we have opened up our beta to invite the community to actively participate in the journey. We encourage you to share your thoughts, ideas, and suggestions with us on [Discord](https://discord.com/invite/23xU2hYrSJ) or [Twitter](https://twitter.com/getnoodl).
-
-Thank you for trying out the new features, and happy noodling!
diff --git a/docs/getting-started/overview.mdx b/docs/getting-started/overview.mdx
@@ -2,23 +2,23 @@
 hide_title: true
 ---
 
-import { LinkButtonGrid } from '../../src/blocks/LinkButtonGrid.tsx'
+import { LinkButtonGrid } from '../../src/blocks/LinkButtonGrid.tsx';
 
 # How Noodl works
 
 Noodl has two fundamental parts:
 
 1. **A visual builder for modern web application frontends.** You compose frontends from a library of UI Controls that are highly customizable, down to fine grained animations and transitions. A versatile navigation system that supports both simple and more complex nested navigation and popups. Re-usable components to support dynamic, reactive interfaces. And you build logic either visually or with simple Javascript functions.
 
-2. **Integrated cloud services.** A solid easy to learn database where you manage classes and records. You can of course also query data and create record relations. The cloud database also includes user management (sign up, log in/out) and Access Control. You can create cloud functions, just like building logic on the client, that run in the cloud for background jobs, compound queries, security etc. Noodl can host the cloud services for you or you can host it on your own. It is based on a popular open source project ([Parse](http://parseplatform.org)).
+2. **Integrated cloud services.** A solid easy to learn database where you manage classes and records. You can of course also query data and create record relations. The cloud database also includes user management (sign up, log in/out) and Access Control. You can create cloud functions, just like building logic on the client, that run in the cloud for background jobs, compound queries, security etc. It is based on a popular open source project ([Parse](http://parseplatform.org)), and is fully open source and self-hostable.
 
 ## Getting started
 
 Getting started with Noodl is easy. There are interactive lessons built into the tool that are a great starting point. In the documentation we recommend the following articles to get started.
 
--   First we recommend reviewing the [Workflow overview](workflow) page and then the [Fundamentals](fundamentals) page to get some more meat the bones in terms of what Noodl can do for you.
+- First we recommend reviewing the [Workflow overview](workflow) page and then the [Fundamentals](fundamentals) page to get some more meat the bones in terms of what Noodl can do for you.
 
--   Then dive into the [Guides](/docs/learn) section and start digging into the wonderful world on Noodl.
+- Then dive into the [Guides](/docs/learn) section and start digging into the wonderful world on Noodl.
 
 Also don't forget to check out our [Community channels](https://www.noodl.net/community) - great ways to learn and make new friends!
Original file line number	Diff line number	Diff line change
Expand Up		@@ -159,4 +159,4 @@ In the same way we can easily ask follow-up questions:

		## Age of exploration

		While a lot is known about ChatGPT, there are still a lot of dark spots on the AI-map. New strategies, primers, tips and tricks are invented and uncovered every day. If you have found something that we havent touched upon here and feel like sharing it, please hop on in to the #chat-gpt channel on our [Discord server](https://discord.com/invite/23xU2hYrSJ). Exploration is more fun together, and we all stand on the shoulders of each other in this exciting new step within technology.
		While a lot is known about ChatGPT, there are still a lot of dark spots on the AI-map. New strategies, primers, tips and tricks are invented and uncovered every day. If you have found something that we havent touched upon here and feel like sharing it, please hop on in to the #chat-gpt channel on the [Discord server](https://discord.com/invite/23xU2hYrSJ). Exploration is more fun together, and we all stand on the shoulders of each other in this exciting new step within technology.
Original file line number	Diff line number	Diff line change
Expand Up		@@ -4,4 +4,4 @@ hide_title: true

		# AI Assisted Development

		Noodl is a low code web app builder that will have you creating applications faster and smarter. Even though Noodl is technically a low code tool you can reduce the majority of coding using ChatGPT, making it much more accessible to no coders. Here we collect guides that target the different parts of Noodl where code is required and show you how to use ChatGPT to fill in the blanks. We are comitted to making Noodl accessible to no-coders without reducing the power and capabilities.
		Noodl is a low code web app builder that will have you creating applications faster and smarter. Even though Noodl is technically a low code tool you can reduce the majority of coding using ChatGPT, making it much more accessible to no coders. Here is a collection of guides that target the different parts of Noodl where code is required and shows you how to use ChatGPT to fill in the blanks.