From 885ed165ec9c95413e8592164fe9b31e0d0c7052 Mon Sep 17 00:00:00 2001 From: oanelson Date: Wed, 4 Dec 2024 18:52:16 -0800 Subject: [PATCH 1/2] Closes 166 --- .../libraries/index.mdx | 3 +-- .../libraries/radfish.md | 2 +- .../libraries/react-radfish.md | 4 ++-- docs/developer-documentation/upgrading.md | 19 ++++++++++--------- 4 files changed, 14 insertions(+), 14 deletions(-) diff --git a/docs/developer-documentation/libraries/index.mdx b/docs/developer-documentation/libraries/index.mdx index 21ec8b0..f237af0 100644 --- a/docs/developer-documentation/libraries/index.mdx +++ b/docs/developer-documentation/libraries/index.mdx @@ -4,8 +4,7 @@ sidebar_position: 5 # Libraries -{/* Write top text here */} - +You can learn about the libraries and packages used in RADFish here. ```mdx-code-block import DocCardList from '@theme/DocCardList'; diff --git a/docs/developer-documentation/libraries/radfish.md b/docs/developer-documentation/libraries/radfish.md index fd0bb88..b40b511 100644 --- a/docs/developer-documentation/libraries/radfish.md +++ b/docs/developer-documentation/libraries/radfish.md @@ -5,6 +5,6 @@ description: Core modules to build a RADFish app # `radfish` -The `radfish` NPM package contains the core Javascript modules needed to power any RADFish project. The idea is that these modules are framework agnostic, and should be fully functional whether you are building an application in React, Svelte, or even Vanilla JavaScript. +The `radfish` NPM package contains the core JavaScript modules for any RADFish project. These modules are framework-agnostic. They should be fully functional whether you are building an application in React, Svelte, or even Vanilla JavaScript. This library is open source and can be found here: [https://www.npmjs.com/package/@nmfs-radfish/radfish](https://www.npmjs.com/package/@nmfs-radfish/radfish) diff --git a/docs/developer-documentation/libraries/react-radfish.md b/docs/developer-documentation/libraries/react-radfish.md index 631983d..c702f46 100644 --- a/docs/developer-documentation/libraries/react-radfish.md +++ b/docs/developer-documentation/libraries/react-radfish.md @@ -5,8 +5,8 @@ description: Modules to build a RADFish app in React # `react-radfish` -The `react-radfish` NPM package contains the React component library needed to power any RADFish project built with React or React flavored framework (like Remix or Next.js). The idea is that these modules expose components that can be used in a consistent fashion across different React projects. +The `react-radfish` NPM package contains the React component library for any RADFish project. It's designed for projects built with React or React-flavored frameworks (like Remix or Next.js). These modules expose components that can be used consistently across different React projects. -Note that this library is not meant to replace the `@trussworks` library, and is meant to live alongside it. Where possible, you should look to leverage the `@trussworks` library. However, if there is a component not exposed by `@trussworks`, or there is some shortcoming with the `@trussworks` implementation, you can rely on the components exposed from the `@nmfs-radfish/react-radfish` package. +Note that this library is not meant to replace the `@trussworks` library. It's meant to work alongside it. Where possible, you should leverage the `@trussworks` library. However, if there's a component not in `@trussworks`, or there's shortcomings with the `@trussworks` implementation, you can rely on the components in the `@nmfs-radfish/react-radfish` package. This library is open source and can be found here: [https://www.npmjs.com/package/@nmfs-radfish/react-radfish](https://www.npmjs.com/package/@nmfs-radfish/react-radfish) diff --git a/docs/developer-documentation/upgrading.md b/docs/developer-documentation/upgrading.md index 9062354..5f2eac7 100644 --- a/docs/developer-documentation/upgrading.md +++ b/docs/developer-documentation/upgrading.md @@ -6,11 +6,11 @@ sidebar_position: 7 ## How to keep your RADFish project up to date -Keeping your project up to date with the latest RADFish versions is essential for stability, security, and accessing the latest features. Below is a step-by-step guide on how to update your RADFish packages and ensure your project remains free of warnings and errors. +Updating your RADFish version ensures stability, security, and the latest features. It also keeps your project free of warnings and errors. This section provides a step-by-step guide on how to update your RADFish packages. -### 1. Upgrade packages +### 1. Upgrade Packages - 1. **Run command**: In the root of your project run: + 1. **Run command:** In the root of your project, run: ```bash npm update ``` @@ -24,7 +24,7 @@ Keeping your project up to date with the latest RADFish versions is essential fo ### 2. Handling Warnings During Updates - While updating your packages, you might encounter warnings(not necessarily RADFish-specific). These warnings often occur when certain packages in your project are outdated or incompatible. To get rid of these warnings: + While updating your packages, you might encounter warnings. These warnings may not necessarily be RADFish-specific. These warnings often occur when certain packages in your project are outdated or incompatible. To get rid of these warnings: 1. **Check for outdated packages:** Run the command below to list all outdated packages, including those not related to RADFish. ```bash @@ -46,11 +46,13 @@ Keeping your project up to date with the latest RADFish versions is essential fo npm uninstall ``` -### 3. Overview of Packages managed in `radfish` and `react-radfish` +### 3. Overview of Packages Managed in `radfish` and `react-radfish` -In your RADFish project, the following packages are managed and should be kept up to date: +In your RADFish project, these packages are managed and should be kept up to date: +- `@nmfs-radfish/radfish` +- `@nmfs-radfish/react-radfish` -#### 1. @nmfs-radfish/radfish: +#### `@nmfs-radfish/radfish` This package handles the core logic and utilities for RADFish. It manages several dependencies that are essential for the functionality of the RADFish system: - **Dependencies:** @@ -58,12 +60,11 @@ This package handles the core logic and utilities for RADFish. It manages severa - `msw`: A library for mocking API requests in development and testing environments. - `react`: The core React library required for building user interfaces in RADFish projects. -#### 2. @nmfs-radfish/react-radfish: +#### `@nmfs-radfish/react-radfish` This package provides UI components for React applications using RADFish. It manages several dependencies that enhance the user interface and functionality: - **Dependencies:** - - `@tanstack/react-table`: A headless table library for building powerful data tables in React. - `@trussworks/react-uswds`: A component library that implements the U.S. Web Design System (USWDS) for React. From 140e76b8a33ef0b188096fe7eb560e1988975d83 Mon Sep 17 00:00:00 2001 From: Jay Giang Date: Thu, 5 Dec 2024 14:10:04 -0800 Subject: [PATCH 2/2] Fix scripts order --- docs/developer-documentation/getting-started.md | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/docs/developer-documentation/getting-started.md b/docs/developer-documentation/getting-started.md index 61c101f..deb980f 100644 --- a/docs/developer-documentation/getting-started.md +++ b/docs/developer-documentation/getting-started.md @@ -77,10 +77,13 @@ npx @nmfs-radfish/create-radfish-app --help ``` Please visit [upgrading](./upgrading.md) for more information. -## Scripts -See [Available Scripts](./building-your-application/available-scripts) for full list of commands. +# Scripts + +**`npm start`** -The **`npm start`** script starts the Vite development server. It runs the app locally with hot module reloading, allowing for fast development and instant updates as you make changes. Open [http://localhost:3000](http://localhost:3000/) to view it in the browser. +This script starts the Vite development server. It runs the app locally with hot module reloading, allowing for fast development and instant updates as you make changes. Open [http://localhost:3000](http://localhost:3000/) to view it in the browser. + +See [Available Scripts](./building-your-application/available-scripts) for full list of commands. ## Next steps Now that you are up and running, see the [Components & Usage](./building-your-application/patterns/components.md) section to start building out your first pages!