Update code changes

This commit is contained in:
2025-06-26 20:24:05 -04:00
parent ff29bccb95
commit dc2fbd971c

120
README.md
View File

@@ -1,97 +1,53 @@
This is a new [**React Native**](https://reactnative.dev) project, bootstrapped using [`@react-native-community/cli`](https://github.com/react-native-community/cli).
# PocketDog
# Getting Started
PocketDog is a mobile companion app for [ArchiveBox](https://archivebox.io), designed to let you read your archived articles on the go.
> **Note**: Make sure you have completed the [Set Up Your Environment](https://reactnative.dev/docs/set-up-your-environment) guide before proceeding.
## Why PocketDog?
## Step 1: Start Metro
I created PocketDog because I wanted an easy way to access and read my ArchiveBox-archived articles from my phone, even when offline. ArchiveBox is great for archiving web content, but there wasn't a simple, mobile-friendly way to browse and read those saved articles—especially the clean, reader-friendly versions generated by Mercury.
First, you will need to run **Metro**, the JavaScript build tool for React Native.
PocketDog solves this by connecting to your ArchiveBox instance, downloading the Mercury-processed HTML files, and saving them to your device for offline reading.
To start the Metro dev server, run the following command from the root of your React Native project:
## Features
- **Connect to your ArchiveBox instance** (API key required)
- **Fetch and download archived articles** (Mercury HTML)
- **Read articles offline** in a clean, mobile-optimized view
- **Mark articles as read/unread**
- **Delete individual or all articles** from your device
- **Simple, modern UI**
## How It Works
1. **Configure your ArchiveBox API URL and API key** in the app's Settings.
2. **Fetch your archive**: The app will connect to your ArchiveBox server, list your archived articles, and download the Mercury HTML files for offline reading.
3. **Read anywhere**: Browse and read your saved articles, even without an internet connection.
## Requirements
- An [ArchiveBox](https://archivebox.io) instance with API access and Mercury content extraction enabled
- iOS device (tested on iOS; Android support coming soon)
## Getting Started
1. Clone this repo and install dependencies:
```sh
# Using npm
npm start
# OR using Yarn
yarn start
yarn install
```
## Step 2: Build and run your app
With Metro running, open a new terminal window/pane from the root of your React Native project, and use one of the following commands to build and run your Android or iOS app:
### Android
2. Run on iOS:
```sh
# Using npm
npm run android
# OR using Yarn
yarn android
```
### iOS
For iOS, remember to install CocoaPods dependencies (this only needs to be run on first clone or after updating native deps).
The first time you create a new project, run the Ruby bundler to install CocoaPods itself:
```sh
bundle install
```
Then, and every time you update your native dependencies, run:
```sh
bundle exec pod install
```
For more information, please visit [CocoaPods Getting Started guide](https://guides.cocoapods.org/using/getting-started.html).
```sh
# Using npm
npm run ios
# OR using Yarn
cd ios && pod install && cd ..
yarn ios
```
3. Open the app, go to Settings, and enter your ArchiveBox API URL and API key.
4. Fetch your archive and start reading!
If everything is set up correctly, you should see your new app running in the Android Emulator, iOS Simulator, or your connected device.
## Notes
This is one way to run your app — you can also build it directly from Android Studio or Xcode.
- Only tested on iOS so far. Android support is planned.
- This app downloads and stores the Mercury-processed HTML files for each article, so you can read them offline.
- No personal data or API keys are stored in the codebase; all sensitive info is kept on your device only.
## Step 3: Modify your app
## License
Now that you have successfully run the app, let's make changes!
Open `App.tsx` in your text editor of choice and make some changes. When you save, your app will automatically update and reflect these changes — this is powered by [Fast Refresh](https://reactnative.dev/docs/fast-refresh).
When you want to forcefully reload, for example to reset the state of your app, you can perform a full reload:
- **Android**: Press the <kbd>R</kbd> key twice or select **"Reload"** from the **Dev Menu**, accessed via <kbd>Ctrl</kbd> + <kbd>M</kbd> (Windows/Linux) or <kbd>Cmd ⌘</kbd> + <kbd>M</kbd> (macOS).
- **iOS**: Press <kbd>R</kbd> in iOS Simulator.
## Congratulations! :tada:
You've successfully run and modified your React Native App. :partying_face:
### Now what?
- If you want to add this new React Native code to an existing application, check out the [Integration guide](https://reactnative.dev/docs/integration-with-existing-apps).
- If you're curious to learn more about React Native, check out the [docs](https://reactnative.dev/docs/getting-started).
# Troubleshooting
If you're having issues getting the above steps to work, see the [Troubleshooting](https://reactnative.dev/docs/troubleshooting) page.
# Learn More
To learn more about React Native, take a look at the following resources:
- [React Native Website](https://reactnative.dev) - learn more about React Native.
- [Getting Started](https://reactnative.dev/docs/environment-setup) - an **overview** of React Native and how setup your environment.
- [Learn the Basics](https://reactnative.dev/docs/getting-started) - a **guided tour** of the React Native **basics**.
- [Blog](https://reactnative.dev/blog) - read the latest official React Native **Blog** posts.
- [`@facebook/react-native`](https://github.com/facebook/react-native) - the Open Source; GitHub **repository** for React Native.
MIT