Code Monkey home page Code Monkey logo

reactiveneko's Introduction

reactive/atomicneko template

This repository is the repository of my homepage (https://futa.moe/amphineko/) that can be used as a template.

Visit https://amphineko.github.io/reactiveneko/ for a live deployment of the master branch.

A nightly build (the latest master version) with all feature flags enabled, is available at https://reactiveneko.vercel.app/.

This repository is the experimental next version of atomicneko.

Getting Started

Indeed, you should inspect pages/index.tsx to change the content of the page before deploying.

To start a local development server, run yarn to install dependencies, and yarn dev to start the development server.

The server should be available at http://localhost:3000.

Deploying

There are multiple ways to deploy this project. Please see https://nextjs.org/docs/deployment for more information.

Here are some recommended options: Vercel, Netlify, GitHub Pages (requires turning off image optimization, see below), and Cloudflare Pages.

Exporting

Alternatively, a statically generated version of this project can be exported using yarn export.

You may experience some issues during the export process, due to the usage of next/image component.

Following the official documentation or error messages, you can use next export by disabling image optimization.

% yarn export
...
Error: Image Optimization using Next.js' default loader is not compatible with `next export`.
  Possible solutions:
    - Use `next start` to run a server, which includes the Image Optimization API.
    - Configure `images.unoptimized = true` in `next.config.js` to disable the Image Optimization API.
  Read more: https://nextjs.org/docs/messages/export-image-api
    at /Users/amphineko/Devcat/reactiveneko/node_modules/next/dist/export/index.js:153:23
    at async Span.traceAsyncFn (/Users/amphineko/Devcat/reactiveneko/node_modules/next/dist/trace/trace.js:79:20)

FAQs

Dynamic Steam profile name doesn't work

There are some options to solve this issue.

With official Steam API: Update NEXT_PUBLIC_STEAM_GET_PLAYER_SUMMARIES in the .env file or your deployment settings, to use your own Steam API key and Steam ID. Please notice that you should configure your Steam API key to return your own domain name for CORS requests.

Proxy server: Alternatively, you can use a proxy server to handle the CORS requests.

Replace with static values: You can still replace the dynamic component with a static name on the page, like how the osu! profile name is displayed.

Roadmap

  • Migrate to React and next.js
  • Add dynamically fetched usernames
  • Add static site generation (blocked by next/image unsupported by next export)
  • Add other roadmap items

reactiveneko's People

Contributors

amphineko avatar ricky8955555 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.