DEV Community: panfan

Kit — A Privacy-First, Cross-Platform Toolbox with 70+ Utilities

panfan — Thu, 25 Sep 2025 09:29:05 +0000

One app for developers, designers, and knowledge workers. Runs entirely on-device. Web + Desktop (Tauri).

Kit bundles 70+ high-frequency tools across text, design, image/audio/video, crypto & hash, data format conversions, network, generators, and dev utilities.
100% local processing, no cloud upload, works offline.
Ships for Web and Desktop (Windows/macOS/Linux via Tauri). MIT-licensed and free.
Try it online and get the app:
- Live demo: kit.manon.icu
- Custom domain: kit.manon.icu
- GitHub: aafnnp/kit

Why I built Kit

We all hop between countless “small tools” daily: JSON formatter, image compressor, hash checksum, timestamp converter, JWT decoder… They’re scattered across random websites with inconsistent UX, ads, and privacy concerns. Kit consolidates these essentials into one modern, clean, offline-capable app.

Core Value

Privacy-first: 100% local processing in browser/desktop. No data leaves your device.
Speed: modern stack, code-splitting, predictive preloading, sub-second response.
Cross-platform: Web in one click; Tauri desktop for Windows/macOS/Linux.
Design: minimal, responsive, dark mode, tasteful motion.
Open source: MIT. Free to use and extend.

What’s Inside (70+ tools, 8 categories)

Text: word count, case converter, regex tester, diff (text/JSON), Markdown preview, text→PDF, table sort/filter, MD TOC
Color/Design: color picker, HEX↔RGB, gradients, shadows, border radius, favicon maker, CSS clamp
Image/AV: compress, resize, crop, format convert, EXIF viewer, SVG minify, GIF splitter, video trim, audio convert, image→PDF, SVG sprite
Crypto/Hash: MD5, SHA-256, Bcrypt, file checksum, password generator
Date/Time: timestamp↔date, cron parser, time diff, timezone convert
Data Formats: JSON/YAML/CSV/XLSX conversions, URL/Base64 codecs, JSON→TS interface, live HTML
Network: HTTP status lookup, UA parser, MIME search, DNS lookup, IP info, URL inspector
Generators & Dev: UUID/QR/Barcode/fake users/lottery, JWT decode/sign, regex cheatsheet, Mermaid preview, matrix ops, Roman↔Arabic

Thoughtful UX

Global search + categories, favorites, and “recent”
Smart preloading of frequently used tools
Keyboard accessibility, responsive layouts from mobile to ultrawide

Under the Hood

Frontend: React 19, TypeScript 5.9, Vite 7, TailwindCSS 4, Motion
Routing/Data: @tanstack/react-router, @tanstack/react-query
UI/UX: Radix UI, shadcn/ui, lucide-react, @dnd-kit
Desktop: Tauri 2 (Rust), multi-platform packaging
Perf: code-splitting, predictive preloading, tree-shaking, asset optimization
Deploy: Vercel (SPA), Cloudflare Assets (kit.manon.icu)
Automation: changelog generator, bundle analysis, build optimization

Who It’s For

Developers: formatting, hashing, parsing, visualization, regex, JSON/CSV/XLSX
Designers: color utilities, gradients, shadows, icons, batch image ops
Creators & office users: text stats, PDF conversion, table/data cleanup
Privacy-conscious users: audit the source, use fully offline

3-Minute Start

Try online: kit.manon.icu
Local dev

git clone https://github.com/aafnnp/kit.git
cd kit
npm install
npm run dev

Desktop (Tauri)

# Install Tauri prerequisites first (see official docs)
npm run tauri dev
npm run tauri build

Roadmap

Near term: more tools, mobile polish, more locales, continued perf work
Long term: plugin system, optional cloud sync, team features, public APIs

Call to Action

If you’re tired of juggling a dozen sites for “tiny tasks” or care about privacy, give Kit a spin. It’s not one tool—it’s your Swiss Army knife for everyday digital chores.

Live: kit.manon.icu
GitHub: aafnnp/kit
Issues/Discussions: feedback and ideas welcome

If Kit helps you, please star the repo—it genuinely helps the project grow.

Course Recap and Next Steps in Swift Programming

panfan — Fri, 01 Sep 2023 12:05:08 +0000

As we wrap up this course, it's important to take a moment to reflect on the journey we've embarked on together. Over the past eight weeks, we've covered a wide range of topics, from the basics of Swift programming to the intricacies of creating a user-friendly weather application.

Course Recap

We started with an introduction to Swift, where we learned about its syntax, control flow, functions, and data structures. We then delved into SwiftUI, exploring how to create interactive user interfaces.

In the following weeks, we covered networking, understanding HTTP and REST, and making API calls with Swift. We learned how to access and use a weather API, parse JSON data, and represent this data using models.

We also explored the Core Location framework to fetch user location data and learned how to save and load user preferences. Finally, we focused on enhancing the user experience of our app, testing, and debugging.

Improving Your Weather Application

While your weather application is now functional, there's always room for improvement. Consider adding more features, such as:

A weekly or hourly weather forecast.
Weather alerts or notifications.
Integration with the user's calendar to provide weather forecasts for upcoming events.
A feature to share the weather forecast with friends via social media or messaging apps.

Further Learning and Development in Swift Programming

Swift is a powerful and versatile language, and there's always more to learn. Here are some resources for further learning:

Apple's Swift Documentation: This is your go-to resource for anything related to Swift. It's comprehensive, regularly updated, and includes plenty of examples.
Swift Forums: This is a great place to connect with other - Swift developers, ask questions, and share your work.
Swift Playgrounds: This is an app for iPad and Mac that makes learning Swift interactive and fun. It's a great way to practice your skills.

Final Thoughts

Remember, becoming proficient in any programming language takes time and practice. Don't be discouraged if you encounter difficulties or challenges along the way. Keep practicing, keep building, and most importantly, keep learning.

Congratulations on completing this course, and best of luck in your future Swift programming endeavors!

Reviewing and Troubleshooting Your Weather App

panfan — Fri, 01 Sep 2023 12:03:59 +0000

In this section, we will focus on the crucial steps of reviewing and troubleshooting your weather application. This process involves testing your application, debugging common issues, reviewing your code for optimization, and ensuring your application handles different weather conditions and user locations effectively.

Testing Your Application

Testing is a critical part of the development process. It ensures that your application works as expected and helps identify any potential issues. There are two types of testing you should perform:

Unit Testing: This involves testing individual components of your application in isolation. For example, you might test that your weather data parsing function correctly converts JSON data into the appropriate Swift data structures.
UI Testing: This involves testing the user interface and the user interaction flows of your application. For example, you might test that tapping a button correctly triggers a weather data fetch.

Debugging Common Issues

Even with careful planning and coding, you're likely to encounter issues in your application. Swift provides a powerful suite of debugging tools to help you identify and resolve these issues. Here are some common issues you might encounter:

Runtime Errors: These are errors that occur while your application is running. They can be caused by a variety of issues, such as attempting to access a non-existent element of an array.
Logic Errors: These are errors where your code doesn't behave as expected, even though it's syntactically correct. For example, you might have a logic error if your weather data isn't correctly displayed in your user interface.

Code Review and Optimization

Once your application is working correctly, it's a good idea to review your code. Look for areas where you can make your code more efficient, readable, or maintainable. Here are some things to consider:

Performance: Are there parts of your code that are slow or inefficient? Can you optimize these parts to make your application run faster?
Readability: Is your code easy to understand? Have you used clear variable and function names? Have you included comments to explain complex parts of your code?
Maintainability: Is your code structured in a way that makes it easy to modify or extend in the future? Have you avoided duplicating code?

Handling Different Weather Conditions and User Locations

Finally, ensure your application can handle a variety of weather conditions and user locations. Test your application with different weather data to ensure it displays correctly. Also, test your application with different user locations to ensure it correctly fetches and displays the appropriate weather data.

By following these steps, you can ensure that your weather application is robust, reliable, and ready for users to enjoy. Remember, building an application is an iterative process, and there's always room for improvement. Happy coding!

Starting Your Final Project: Building Your Own Weather App

panfan — Fri, 01 Sep 2023 12:02:52 +0000

In this unit, we will embark on the exciting journey of creating your own weather application from scratch. This is the culmination of all the knowledge and skills you've acquired throughout the course. Let's dive in!

Overview of the Final Project

The final project of this course is to create a fully functional weather application. This application should be able to fetch and display weather data based on the user's location. It should also allow users to manually search for the weather in different locations. The user interface should be clean, intuitive, and responsive.

Planning Your Weather Application

Before you start coding, it's important to plan your application. This includes designing the user interface, deciding on the features you want to include, and understanding how you will structure your code. Here are some points to consider:

User Interface: Sketch out how you want your application to look. Consider the layout of the weather data, the color scheme, and any icons you might want to use.
Features: Decide on the features you want to include in your application. At a minimum, your application should display the current weather, including temperature, humidity, and weather conditions (e.g., sunny, cloudy, rainy). You might also want to include additional features, such as a five-day forecast or the ability to save favorite locations.
Code Structure: Plan how you will structure your code. Consider the different classes and functions you will need, and how they will interact with each other.

Building Your Weather Application

Once you've planned your application, it's time to start building. Here are some steps to guide you:

Set Up Your Project: Create a new Swift project in Xcode. Choose a name for your application and set up the basic project structure.
Build the User Interface: Using SwiftUI, build the user interface for your application. This should match the design you sketched out in your planning stage.
Implement the Weather API: Set up the weather API in your application. This will involve making API calls, parsing the JSON data, and displaying the data in your user interface.
Add User Location Functionality: Using the Core Location framework, implement functionality to get the user's current location and fetch the weather data for that location.
Implement Additional Features: Depending on the features you decided to include in your planning stage, you might need to implement additional functionality, such as a search feature or a five-day forecast.

Remember, building an application is an iterative process. Don't be discouraged if your application isn't perfect the first time around. Keep refining and improving your code, and don't be afraid to ask for help if you get stuck. Good luck!

Testing and Debugging Your Weather App

panfan — Fri, 01 Sep 2023 12:01:32 +0000

In this unit, we will delve into the crucial aspects of testing and debugging your weather application. Ensuring your app works smoothly and as expected is a key part of the development process. Let's explore how to do this effectively using Swift and Xcode.

Introduction to Testing in Swift and Xcode

Testing is a critical part of software development that ensures your code works as expected. In Swift, you can write tests using XCTest, a framework provided by Xcode. XCTest supports both unit tests, which test individual pieces of code, and UI tests, which test the user interface and interactions.

Writing and Running Unit Tests for Your Weather App

Unit tests are used to verify that individual sections of your code are working correctly. For your weather app, you might write unit tests to check that:

The weather data is correctly parsed from the API response.
The user's location is accurately determined.
The user's preferences are correctly saved and loaded.
To write a unit test in Xcode, you'll create a new test case class and write test methods within this class. Each test method should focus on a specific part of your code.

Once you've written your tests, you can run them in Xcode by clicking on the diamond symbol next to each test or by using the Product > Test menu option.

Debugging Common Issues in Swift Apps

Even with thorough testing, it's likely that you'll encounter issues or bugs in your app. Debugging is the process of finding and resolving these issues.

Common issues you might encounter in your weather app could include:

The app crashes when trying to access the weather API.
The user's location is not correctly determined.
The weather data is not correctly displayed in the UI.
Using Xcode's Debugging Tools to Identify and Fix Issues

Xcode provides several tools to help you debug your app:

The debug area: This shows the output of your app and any errors or warnings.
The debug navigator: This shows the call stack, which is the sequence of method calls that led to the current point in your code.
Breakpoints: These allow you to pause the execution of your app at a specific line of code. You can then inspect the values of variables and see the exact path your code is taking.

Ensuring the App Works Smoothly Under Different Conditions and Scenarios

Finally, it's important to test your app under different conditions and scenarios. For example, how does your app behave if there's no internet connection? What if the weather API is down? By considering and testing these scenarios, you can make your app more robust and provide a better user experience.

Improving User Interface and User Experience in Your Weather App

panfan — Fri, 01 Sep 2023 12:00:35 +0000

In this unit, we will delve into the principles of good User Interface (UI) and User Experience (UX) design, and how to apply these principles to improve your weather application.

Understanding the Principles of Good UI/UX Design

UI/UX design is crucial in determining how users interact with your application. Good UI/UX design ensures that your app is not only visually appealing but also intuitive and easy to use. Some key principles include consistency, simplicity, clarity, and feedback.

Implementing Intuitive Navigation

Navigation is a fundamental aspect of UX design. It should be intuitive and straightforward, allowing users to easily move around your app. In the context of a weather app, users should be able to easily switch between different screens such as current weather, forecast, settings, etc.

Enhancing Visual Appeal with Animations and Transitions

Animations and transitions can significantly enhance the visual appeal of your app. They can be used to draw attention to specific elements, provide feedback, indicate loading states, and more. However, they should be used sparingly and appropriately, as excessive or inappropriate use can be distracting and negatively impact the user experience.

Incorporating User Feedback

User feedback is a valuable resource for improving your app's UI/UX. It provides insights into what users like and dislike about your app, and what they find confusing or difficult to use. This feedback can be gathered through user testing, surveys, reviews, and other methods.

Ensuring Accessibility and Inclusivity

Accessibility is an important aspect of UX design that ensures your app can be used by as many people as possible, including those with disabilities. This includes providing alternative text for images, ensuring sufficient color contrast, and more. Inclusivity, on the other hand, involves designing your app to be usable and enjoyable for people of all backgrounds, cultures, and languages.

By applying these principles and techniques, you can significantly improve the UI/UX of your weather app, making it more appealing and enjoyable for users.

Designing App Icons and Launch Screens for Your Weather Application

panfan — Fri, 01 Sep 2023 11:59:51 +0000

Creating an engaging and visually appealing application goes beyond just the user interface of the app itself. The first impression users get of your app is from its icon and launch screen. This article will guide you through the process of designing and implementing custom app icons and creating an engaging launch screen for your weather application.

Importance of App Icons and Launch Screens

App icons are the first point of contact between the user and your application. A well-designed app icon can attract users and encourage them to download and use your app. Similarly, the launch screen, also known as the splash screen, is the first screen that users see when they open your app. An engaging launch screen can create a positive first impression and set the tone for the user experience.

Designing and Implementing Custom App Icons

When designing your app icon, consider the purpose of your app and what it represents. For a weather app, you might consider elements like sun, clouds, raindrops, or a thermometer. Keep the design simple and recognizable. Use colors that are attractive and consistent with the overall design of your app.

Once you have your design, you can add it to your project in Xcode. The app icon should be added to the AppIcon asset catalog in your project. Xcode requires multiple sizes of the app icon for different devices and contexts, so make sure to provide all the necessary sizes.

Creating an Engaging Launch Screen

The launch screen is not a place for elaborate artwork or branding. It's a transitional screen that's shown as your app loads. The best practice is to make your launch screen resemble the initial screen of your app.

You can create a launch screen by adding a new Launch Screen in the Interface Builder in Xcode. Keep the design simple and clean. You can use your app's primary colors and include elements from your user interface to create a sense of continuity.

Adapting App Icons and Launch Screens for Different Device Sizes and Resolutions

Different Apple devices have different screen sizes and resolutions, and your app icon and launch screen need to look good on all of them. Xcode's asset catalog helps you manage multiple versions of each image for different device characteristics. You should provide different sizes of your app icon for different devices, and use Auto Layout in your launch screen to ensure it looks good on all screen sizes.

In conclusion, a well-designed app icon and launch screen can significantly enhance the user's first impression of your app. By following these guidelines, you can create an attractive and engaging presence for your weather app right from the start.

Saving and Loading User Preferences in Swift

panfan — Sat, 26 Aug 2023 10:22:09 +0000

In this unit, we will explore how to manage user preferences in a weather application. User preferences are a crucial part of any application as they allow users to customize the app according to their needs and provide a personalized user experience.

Understanding User Preferences

In the context of a weather application, user preferences can include settings like temperature unit (Celsius or Fahrenheit), location settings (use current location or manually enter a location), and more. These preferences can significantly affect how the user interacts with the app and the information they receive.

Creating a Settings Page

The first step in managing user preferences is to create a settings page where users can adjust their preferences. This page can include switches, sliders, and other UI elements that allow users to customize their app experience. For example, you might include a switch for users to toggle between Celsius and Fahrenheit or a text field for users to enter a preferred location.

Saving User Preferences with UserDefaults

Once you have a settings page, you need a way to save the user's preferences. In Swift, you can use the UserDefaults system to store small amounts of data like user preferences.

Here's an example of how you can save a user's preference for temperature unit:

let defaults = UserDefaults.standard
defaults.set(isCelsius, forKey: "TemperatureUnit")

In this code, isCelsius is a Boolean that represents whether the user prefers Celsius (if isCelsius is true) or Fahrenheit (if isCelsius is false).

Loading and Applying User Preferences

After saving user preferences, you need to load these preferences when the app launches and apply them throughout the app. You can also load these preferences every time the settings page appears.

Here's how you can load the temperature unit preference:

let defaults = UserDefaults.standard
let isCelsius = defaults.bool(forKey: "TemperatureUnit")
Once you've loaded the user's preferences, you can use this information to customize the app's behavior. For example, you can use the isCelsius value to determine how to display temperatures throughout the app.

Updating Weather Data Based on User Preferences

Finally, user preferences should affect how the app fetches and displays weather data. For example, if a user enters a preferred location, the app should fetch weather data for that location instead of the user's current location. Similarly, the app should display temperatures in the user's preferred temperature unit.

By managing user preferences, you can provide a more personalized and user-friendly experience in your weather application.

Fetching User Location and Weather Data

panfan — Sat, 26 Aug 2023 10:21:00 +0000

In this unit, we will delve into the process of fetching the user's current location using the Core Location framework and integrating this location data with the weather API to fetch and display relevant weather data in our application.

Fetching User's Current Location

The first step in fetching the user's current location is to import the Core Location framework into your Swift file. This framework provides the necessary classes and protocols to configure and schedule location delivery and send location events to your app.

Once the framework is imported, you need to create an instance of CLLocationManager and request the user's permission to access their location data. This can be done using the requestWhenInUseAuthorization method. It's important to handle the case where the user denies permission.

After obtaining the user's permission, you can start updating the user's location using the startUpdatingLocation method. The CLLocationManager will then start sending location updates to its delegate.

Handling Location Updates and Errors

The CLLocationManagerDelegate protocol defines methods used by the CLLocationManager object to notify your app when the location updates or when there is an error in fetching the location.

You can use the didUpdateLocations method to handle location updates. This method gives you an array of CLLocation objects. The last object in this array is the most recent location update.

In case of any error in fetching the location, the didFailWithError method is called. You can use this method to handle any errors that might occur while fetching the location.

Integrating User Location with Weather API

Once you have the user's location, you can integrate it with the weather API to fetch the weather data for that location. Most weather APIs allow you to fetch weather data based on latitude and longitude, which can be obtained from the CLLocation object.

You can make an API call with the user's latitude and longitude as parameters to fetch the weather data. Once you receive the data, you can parse it and update your app's UI to display the weather data.

Displaying Location-Based Weather Data

After fetching and parsing the weather data, you can update your app's UI to display this data. You can display various information like the current temperature, humidity, wind speed, and weather conditions like clear, cloudy, or rainy.

In conclusion, fetching the user's location and integrating it with the weather API is a crucial part of developing a weather app. It allows you to provide the user with accurate and relevant weather data based on their current location.

Introduction to Core Location Framework

panfan — Sat, 26 Aug 2023 10:18:57 +0000

The Core Location framework is a powerful tool provided by Apple that allows developers to retrieve the geographical location and orientation of a device. This framework is essential for creating location-aware applications, such as a weather app that provides weather updates based on the user's current location.

Understanding the Core Location Framework

The Core Location framework provides classes and protocols to configure and schedule location delivery and send location events to the server. It can provide the device's current location, track changes in the device's location, or monitor specific regions.

Importance of User Location in Weather Applications

In a weather application, the user's location is crucial to provide accurate and relevant weather data. By integrating the Core Location framework, the app can fetch the user's current location and use it to request weather data from the weather API. This ensures that the user always receives the most relevant weather updates for their current location.

Requesting and Handling User Permission for Location Access

Before an app can access the user's location, it must request the user's permission. This is done by adding keys to the app's Info.plist file and requesting authorization with the requestWhenInUseAuthorization or requestAlwaysAuthorization methods.

It's important to handle the case where the user denies location access. In such cases, the app should degrade gracefully and continue to function with limited capabilities.

Understanding Location Accuracy and How to Set It

The accuracy of location data is determined by the desiredAccuracy property of the CLLocationManager object. This property allows the app to specify the level of accuracy it needs, which can range from the exact location to the nearest kilometer.

Setting a higher accuracy results in increased power usage and should be used judiciously. For a weather app, an accuracy of kCLLocationAccuracyKilometer is usually sufficient.

In conclusion, the Core Location framework is a vital tool for creating a location-aware weather application. By understanding how to use this framework, you can provide your users with accurate and relevant weather updates based on their current location.

Updating UI with API Data in Swift

panfan — Sat, 26 Aug 2023 01:57:26 +0000

In this unit, we will delve into the process of updating the user interface (UI) with the data fetched from the API. This involves understanding the concept of data binding in Swift and implementing it to reflect the changes in the weather data on the UI. We will also cover error handling techniques during UI updates.

UI Updates

Updating the UI with the fetched weather data is a crucial part of creating a weather application. This involves displaying the data on the screen in a user-friendly manner. In Swift, this can be achieved using various UI elements such as labels, images, and buttons. The data fetched from the API can be displayed on these UI elements.

Data Binding

Data binding is a technique that establishes a connection between the app's UI and the data sources. It ensures that changes in the data source (in our case, the weather data) automatically reflect on the UI.

In Swift, this can be achieved using property observers and SwiftUI's @State and @Binding property wrappers. Property observers willSet and didSet observe and respond to changes in a property's value. SwiftUI's @State and @Binding property wrappers provide a way to create a mutable state for some data, that when changed, will re-render the view that depends on that data.

Implementing Data Binding

To implement data binding, we first need to declare a @Statevariable in the view that will hold the weather data. This variable should be updated whenever new data is fetched from the API.

Next, we bind this variable to the UI elements that display the weather data. This can be done using the $ prefix. For example, if we have a label that displays the temperature, we can bind it to the temperature property of our weather data like this: Text("\(self.$weatherData.temperature)").

Now, whenever the weather data changes, the UI will automatically update to reflect these changes.

Error Handling

Errors can occur during UI updates, especially when dealing with asynchronous data fetching from an API. Swift provides several techniques to handle these errors and ensure that the app doesn't crash unexpectedly.

One common technique is using Swift's do-catch statement to catch and handle errors. Another technique is using optional binding (if let or guard let) to handle cases where the data might be nil.

In the context of our weather app, we can use these techniques to handle cases where the weather data might not be fetched correctly, or the data might be nil. This ensures that our app handles these situations gracefully and provides a smooth user experience.

Representing Weather Data Using Models in Swift

panfan — Sat, 26 Aug 2023 01:55:48 +0000

In this unit, we will delve into the concept of data models in Swift and how to create a data model for our weather data. We will also learn how to map the parsed JSON data to our weather model.

Introduction to Data Models

Data models in Swift are a way of structuring data in a specific format. They are essentially classes or structs that encapsulate related data in a way that makes it easy to work with. Data models are a fundamental part of any application and are particularly useful when dealing with complex data structures, such as the data we receive from a weather API.

Creating a Weather Model

Creating a data model for our weather data involves defining a new struct that represents the data we want to capture. For our weather app, we might define a Weather struct like this:

struct Weather {
    let temperature: Double
    let humidity: Double
    let precipitationProbability: Double
    let summary: String
}

In this struct, we have four properties that represent the key pieces of data we want to capture about the weather: the temperature, humidity, precipitation probability, and a summary of the weather.

Mapping JSON to the Model

Once we have our Weather struct defined, we can map the parsed JSON data to instances of this struct. This involves extracting the relevant pieces of data from the JSON and using them to initialize new Weather instances.

Here's an example of how we might do this:

if let temperature = json["temperature"] as? Double,
   let humidity = json["humidity"] as? Double,
   let precipitationProbability = json["precipProbability"] as? Double,
   let summary = json["summary"] as? String {
    let weather = Weather(temperature: temperature, humidity: humidity, precipitationProbability: precipitationProbability, summary: summary)
    // Do something with `weather`...
}

In this code, we're using optional binding to safely extract the data from the JSON. If any of the data is missing or of the wrong type, the if let statement will fail and the weather instance won't be created.

By the end of this unit, you should have a solid understanding of how to create data models in Swift and how to map JSON data to these models. This is a crucial step in building our weather app, as it allows us to work with the weather data in a structured and type-safe way.