This commit is contained in:
@@ -0,0 +1,36 @@
|
|||||||
|
name: CI
|
||||||
|
|
||||||
|
on:
|
||||||
|
push:
|
||||||
|
branches: [main]
|
||||||
|
pull_request:
|
||||||
|
|
||||||
|
permissions:
|
||||||
|
contents: read
|
||||||
|
|
||||||
|
jobs:
|
||||||
|
validate:
|
||||||
|
runs-on: ubuntu-latest
|
||||||
|
steps:
|
||||||
|
- name: Check out repository
|
||||||
|
uses: actions/checkout@v4
|
||||||
|
|
||||||
|
- name: Set up Node.js
|
||||||
|
uses: actions/setup-node@v4
|
||||||
|
with:
|
||||||
|
node-version: 24
|
||||||
|
|
||||||
|
- name: Enable pnpm through Corepack
|
||||||
|
run: corepack enable
|
||||||
|
|
||||||
|
- name: Install dependencies
|
||||||
|
run: pnpm install --frozen-lockfile
|
||||||
|
|
||||||
|
- name: Typecheck
|
||||||
|
run: pnpm typecheck
|
||||||
|
|
||||||
|
- name: Build application
|
||||||
|
run: pnpm build
|
||||||
|
|
||||||
|
- name: Build Docker image
|
||||||
|
run: docker build --tag porto:ci .
|
||||||
+22
-18
@@ -1,22 +1,26 @@
|
|||||||
FROM node:24-alpine AS development-dependencies-env
|
FROM node:24-alpine AS base
|
||||||
COPY . /app
|
ENV PNPM_HOME="/pnpm"
|
||||||
|
ENV PATH="$PNPM_HOME:$PATH"
|
||||||
|
RUN corepack enable && corepack install --global pnpm@11.12.0
|
||||||
WORKDIR /app
|
WORKDIR /app
|
||||||
RUN npm ci
|
|
||||||
|
|
||||||
FROM node:24-alpine AS production-dependencies-env
|
FROM base AS development-dependencies-env
|
||||||
COPY ./package.json package-lock.json /app/
|
COPY package.json pnpm-lock.yaml pnpm-workspace.yaml ./
|
||||||
WORKDIR /app
|
RUN pnpm install --frozen-lockfile
|
||||||
RUN npm ci --omit=dev
|
|
||||||
|
|
||||||
FROM node:24-alpine AS build-env
|
FROM base AS production-dependencies-env
|
||||||
COPY . /app/
|
COPY package.json pnpm-lock.yaml pnpm-workspace.yaml ./
|
||||||
COPY --from=development-dependencies-env /app/node_modules /app/node_modules
|
RUN pnpm install --prod --frozen-lockfile
|
||||||
WORKDIR /app
|
|
||||||
RUN npm run build
|
|
||||||
|
|
||||||
FROM node:24-alpine
|
FROM base AS build-env
|
||||||
COPY ./package.json package-lock.json /app/
|
COPY . ./
|
||||||
COPY --from=production-dependencies-env /app/node_modules /app/node_modules
|
COPY --from=development-dependencies-env /app/node_modules ./node_modules
|
||||||
COPY --from=build-env /app/build /app/build
|
RUN pnpm build
|
||||||
WORKDIR /app
|
|
||||||
CMD ["npm", "run", "start"]
|
FROM base AS production
|
||||||
|
ENV NODE_ENV="production"
|
||||||
|
COPY package.json pnpm-lock.yaml pnpm-workspace.yaml ./
|
||||||
|
COPY --from=production-dependencies-env /app/node_modules ./node_modules
|
||||||
|
COPY --from=build-env /app/build ./build
|
||||||
|
EXPOSE 3000
|
||||||
|
CMD ["pnpm", "start"]
|
||||||
|
|||||||
@@ -1,87 +1,7 @@
|
|||||||
# Welcome to React Router!
|
NGAPAIN LU LIAT LIAT README GUA????
|
||||||
|
|
||||||
A modern, production-ready template for building full-stack React applications using React Router.
|
SUKA LU AMA GUA???
|
||||||
|
|
||||||
[](https://stackblitz.com/github/remix-run/react-router-templates/tree/main/default)
|
GAY BANGET MAS.
|
||||||
|
|
||||||
## Features
|

|
||||||
|
|
||||||
- 🚀 Server-side rendering
|
|
||||||
- ⚡️ Hot Module Replacement (HMR)
|
|
||||||
- 📦 Asset bundling and optimization
|
|
||||||
- 🔄 Data loading and mutations
|
|
||||||
- 🔒 TypeScript by default
|
|
||||||
- 🎉 TailwindCSS for styling
|
|
||||||
- 📖 [React Router docs](https://reactrouter.com/)
|
|
||||||
|
|
||||||
## Getting Started
|
|
||||||
|
|
||||||
### Installation
|
|
||||||
|
|
||||||
Install the dependencies:
|
|
||||||
|
|
||||||
```bash
|
|
||||||
npm install
|
|
||||||
```
|
|
||||||
|
|
||||||
### Development
|
|
||||||
|
|
||||||
Start the development server with HMR:
|
|
||||||
|
|
||||||
```bash
|
|
||||||
npm run dev
|
|
||||||
```
|
|
||||||
|
|
||||||
Your application will be available at `http://localhost:5173`.
|
|
||||||
|
|
||||||
## Building for Production
|
|
||||||
|
|
||||||
Create a production build:
|
|
||||||
|
|
||||||
```bash
|
|
||||||
npm run build
|
|
||||||
```
|
|
||||||
|
|
||||||
## Deployment
|
|
||||||
|
|
||||||
### Docker Deployment
|
|
||||||
|
|
||||||
To build and run using Docker:
|
|
||||||
|
|
||||||
```bash
|
|
||||||
docker build -t my-app .
|
|
||||||
|
|
||||||
# Run the container
|
|
||||||
docker run -p 3000:3000 my-app
|
|
||||||
```
|
|
||||||
|
|
||||||
The containerized application can be deployed to any platform that supports Docker, including:
|
|
||||||
|
|
||||||
- AWS ECS
|
|
||||||
- Google Cloud Run
|
|
||||||
- Azure Container Apps
|
|
||||||
- Digital Ocean App Platform
|
|
||||||
- Fly.io
|
|
||||||
- Railway
|
|
||||||
|
|
||||||
### DIY Deployment
|
|
||||||
|
|
||||||
If you're familiar with deploying Node applications, the built-in app server is production-ready.
|
|
||||||
|
|
||||||
Make sure to deploy the output of `npm run build`
|
|
||||||
|
|
||||||
```
|
|
||||||
├── package.json
|
|
||||||
├── package-lock.json (or pnpm-lock.yaml, or bun.lockb)
|
|
||||||
├── build/
|
|
||||||
│ ├── client/ # Static assets
|
|
||||||
│ └── server/ # Server-side code
|
|
||||||
```
|
|
||||||
|
|
||||||
## Styling
|
|
||||||
|
|
||||||
This template comes with [Tailwind CSS](https://tailwindcss.com/) already configured for a simple default starting experience. You can use whatever CSS framework you prefer.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
Built with ❤️ using React Router.
|
|
||||||
|
|||||||
+70
-7
@@ -2,15 +2,78 @@
|
|||||||
@import "tw-animate-css";
|
@import "tw-animate-css";
|
||||||
|
|
||||||
@theme {
|
@theme {
|
||||||
--font-sans: "Inter", ui-sans-serif, system-ui, sans-serif,
|
--font-display: "Anton", ui-sans-serif, sans-serif;
|
||||||
"Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
--font-body: "Source Serif 4", ui-serif, Georgia, serif;
|
||||||
|
--font-terminal: "Courier Prime", ui-monospace, monospace;
|
||||||
|
|
||||||
|
--color-paper: #fef8f4;
|
||||||
|
--color-paper-low: #f8f3ef;
|
||||||
|
--color-panel: #f2ede9;
|
||||||
|
--color-panel-high: #e4dcd6;
|
||||||
|
--color-ink: #1d1b19;
|
||||||
|
--color-muted: #5b4137;
|
||||||
|
--color-outline: #bfb8ac;
|
||||||
|
--color-orange: #ff5c01;
|
||||||
|
--color-orange-dark: #a73a00;
|
||||||
|
--color-cyan: #abece3;
|
||||||
|
--color-cyan-dark: #266862;
|
||||||
}
|
}
|
||||||
|
|
||||||
html,
|
:root {
|
||||||
body {
|
color-scheme: light;
|
||||||
@apply bg-white dark:bg-gray-950;
|
font-synthesis: none;
|
||||||
|
text-rendering: optimizeLegibility;
|
||||||
|
}
|
||||||
|
|
||||||
@media (prefers-color-scheme: dark) {
|
html {
|
||||||
color-scheme: dark;
|
scroll-behavior: smooth;
|
||||||
|
background: var(--color-paper);
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
min-width: 320px;
|
||||||
|
margin: 0;
|
||||||
|
background: var(--color-paper);
|
||||||
|
color: var(--color-ink);
|
||||||
|
}
|
||||||
|
|
||||||
|
::selection {
|
||||||
|
background: var(--color-cyan);
|
||||||
|
color: var(--color-ink);
|
||||||
|
}
|
||||||
|
|
||||||
|
.scanlines {
|
||||||
|
background-image: linear-gradient(
|
||||||
|
to bottom,
|
||||||
|
transparent,
|
||||||
|
transparent 50%,
|
||||||
|
rgb(0 0 0 / 0.02) 50%,
|
||||||
|
rgb(0 0 0 / 0.02)
|
||||||
|
);
|
||||||
|
background-size: 100% 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.terminal-cursor {
|
||||||
|
animation: terminal-blink 1s step-end infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes terminal-blink {
|
||||||
|
0%,
|
||||||
|
100% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
50% {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-reduced-motion: reduce) {
|
||||||
|
html {
|
||||||
|
scroll-behavior: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.terminal-cursor {
|
||||||
|
animation: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
+1
-1
@@ -19,7 +19,7 @@ export const links: Route.LinksFunction = () => [
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
rel: "stylesheet",
|
rel: "stylesheet",
|
||||||
href: "https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap",
|
href: "https://fonts.googleapis.com/css2?family=Anton&family=Courier+Prime:ital,wght@0,400;0,700;1,400;1,700&family=Source+Serif+4:ital,opsz,wght@0,8..60,200..900;1,8..60,200..900&display=swap",
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|||||||
+695
-487
File diff suppressed because it is too large
Load Diff
Generated
-4211
File diff suppressed because it is too large
Load Diff
@@ -2,6 +2,7 @@
|
|||||||
"name": "porto",
|
"name": "porto",
|
||||||
"private": true,
|
"private": true,
|
||||||
"type": "module",
|
"type": "module",
|
||||||
|
"packageManager": "pnpm@11.12.0",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"build": "react-router build",
|
"build": "react-router build",
|
||||||
"dev": "react-router dev",
|
"dev": "react-router dev",
|
||||||
|
|||||||
Generated
+2611
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,2 @@
|
|||||||
|
allowBuilds:
|
||||||
|
esbuild: false
|
||||||
Reference in New Issue
Block a user