DOCSEARCHbyAlgolia
Submit Docs

Skyone's Blog

website·Indexed 32 days ago

https://blog.skyone.dev

A technical blog featuring articles on programming, embedded development, and Linux. Topics include Next.js App Router, Rust-based comment systems, MicroPython interrupts, STM32 and Raspberry Pi Pico debugging, Btrfs snapshots, and mathematics.

Tokens
51.6K
Snippets
213
Records
301
Agent score
55%

What's inside Skyone's Blog

  1. Overview of the View Transitions API

    The View Transitions API simplifies the creation of page transition animations in Single Page Applications (SPAs). It allows developers to animate transitions between different DOM states without manually managing the timing of page loads or route changes. The API captures snapshots of the current state and the new state, then animates between them using CSS.

  2. Overview of mTLS for self-hosted service protection

    Mutual TLS (mTLS) is a security extension of the TLS protocol that requires both the server and the client to provide and verify X.509 certificates. Unlike standard TLS, where only the server is authenticated, mTLS ensures a bidirectional trust channel. This protects services from application-layer vulnerabilities (such as path traversal or command injection) because the connection is terminated at the transport layer if the client cannot provide a valid certificate signed by a trusted Root CA.

  4. Deploy MediaWiki with Traefik, Nginx, and PHP-FPM using Docker Compose

    This example demonstrates how to set up a MediaWiki instance behind Traefik. It uses a three-tier architecture: Traefik as the edge proxy, Nginx as the web server, and a custom PHP-FPM image for MediaWiki. The Nginx container is connected to both the Traefik proxy network and a private mediawiki network to communicate with the PHP backend.
    version: "3.8"

services:
  nginx:
    container_name: mediawiki-nginx
    image: nginx:latest
    restart: unless-stopped
    networks:
      - proxy
      - mediawiki
    volumes:
      - "./config:/etc/nginx/conf.d"
      - "/etc/localtime:/etc/localtime:ro"
      - "./html:/var/www/html"
    labels:
      - "traefik.enable=true"
      - "traefik.http.routers.mediawiki.Rule=Host(`www.wiki.com`)"
      - "traefik.http.routers.mediawiki.service=mediawiki"
      - "traefik.http.services.mediawiki.loadBalancer.server.port=80"

  mediawiki:
    container_name: mediawiki
    image: mediawiki-fpm:latest
    restart: unless-stopped
    build:
      context: build
    networks:
      - mediawiki
    volumes:
      - "/etc/localtime:/etc/localtime:ro"
      - "./html:/var/www/html"
      - "./data:/var/www/data"

networks:
  proxy:
    external: true
  mediawiki:
    name: mediawiki

  5. WireGuard Core Concepts and Architecture

    WireGuard operates on a peer-to-peer model rather than a traditional client-server architecture. Each device is a 'peer' and they are equal. WireGuard creates a virtual network interface (virtual network card) over a physical network. For two peers to establish a connection, at least one must have a public IP address. If neither has a public IP, a third-party device with a public IP must be used as a relay/forwarder.

  6. Understand the basics and classification of software design patterns

    Design patterns are typical solutions to common problems in software design. A pattern typically consists of an Intent (the goal), Motivation (explanation of the problem and solution), and Structure (the relationship between parts).

    Design patterns are categorized into four main types:

    1. Creational Patterns: Focus on mechanisms for creating objects, hiding creation logic to increase flexibility (e.g., Factory, Singleton, Builder, Prototype).
    2. Structural Patterns: Focus on how classes and objects are composed to form larger structures (e.g., Adapter, Bridge, Composite, Decorator, Facade, Flyweight, Proxy).
    3. Behavioral Patterns: Focus on communication and responsibility delegation between objects (e.g., Chain of Responsibility, Command, Interpreter, Iterator, Mediator, Memento, Observer, State, Strategy, Template, Visitor).
    4. J2EE Patterns: Specifically focused on the presentation layer, identified by the Sun Java Center (e.g., MVC, DAO, Front Controller, Service Locator).

  7. Architecture of the skyone.dev blog

    The blog is a custom-built platform developed from scratch using Next.js and Material UI.

    Content Pipeline:

    • Most content is written in Markdown and converted to React components using the remark and rehype ecosystem, adhering to GFM (GitHub Flavored Markdown) standards.
    • Interactive articles are written using MDX.
    • Custom md-loader and mdx-loader implementations are used instead of official Next.js loaders to support advanced customizations like directory structures and previews.

    Comment System:

    • Frontend: Material-UI.
    • Backend: Rust using the Axum framework.
    • Database: SQLite.

  8. Understand the basic concept of Python Decorators

    A Python decorator is essentially a function that takes another function as an argument. It allows you to execute code before and after the wrapped function is called, similar to the concept of callback functions in C. This pattern is used to extend or modify the behavior of a function without permanently modifying its source code.
    def my_decorator(func):
    print("Do something before call func.")
    func() # Call the passed function
    print("Do something after call func.")

  9. Identify the four core Android components

    The Android framework is built around four primary components:

    1. Activity: The entry point for interacting with the user.
    2. Service: For performing long-running operations in the background.
    3. BroadcastReceiver: For receiving system-wide broadcast announcements.
    4. ContentProvider: For managing access to a structured set of app data.

  10. Skyone's Technical Stack and Tooling

    Skyone is a developer with a diverse technical background. Their primary technology stack includes:

    • Frontend: React, Next.js, Plain CSS, Tailwind CSS, and Material-UI.
    • Backend: Node.js (Express), Rust (Axum), and Kotlin (Ktor).
    • Databases: PostgreSQL and SQLite.
    • GUI Development: Qt, Electron, and wxPython.
    • Languages: C, Rust, Java, Kotlin, HTML, CSS, JavaScript, TypeScript, and Python.

    Development Environment:

    • IDEs: JetBrains suite (IntelliJ IDEA, PyCharm, WebStorm, RustRover) and Typora for Markdown.
    • OS: Arch Linux with Btrfs filesystem (using btrfs snapshots for management) and KVM for Windows VMs.
    • Infrastructure: Docker for application management and Traefik as a reverse proxy.

  11. Identify the four main Android components

    The four fundamental components of an Android application are:

    • Activity: Represents a single screen with a user interface.
    • Service: A component that runs in the background to perform long-running operations.
    • BroadcastReceiver: Allows the app to receive and respond to system-wide broadcast announcements.
    • ContentProvider: Manages access to a structured set of data, allowing it to be shared with other apps.

  12. Understand and implement Android Activity components

    An Activity represents a single screen with a user interface and serves as the entry point for user interaction. Each Activity in an application must be declared in the AndroidManifest.xml file. For the main entry point of an application, the activity must include an <intent-filter> with the android.intent.action.MAIN action and the android.intent.category.LAUNCHER category.
    <activity android:name=".MainActivity">
    <intent-filter>
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
    </intent-filter>
</activity>