当前位置：首页 > news >正文

Next.js 学习-1

news 来源：原创 2025/9/18 5:31:27

Next.js学习

引用：https://www.nextjs.cn/learn/basics/create-nextjs-app
在这里插入图片描述
先试试水吧，正好dify用的这个构建的前端项目。

使用

如果您尚未安装 Node.js，请从此处安装。要求 Node.js 10.13 或更高版本。
好吧得用新的了，记得改淘宝的镜像，旧的不能用了，不然执行nvm list available会报错，如下：
在这里插入图片描述

node_mirror: https://npmmirror.com/mirrors/node/
npm_mirror: https://npmmirror.com/mirrors/npm/
在这里插入图片描述
开始用的这个：https://www.nextjs.cn/learn/basics/create-nextjs-app/setup,可惜下载失败了，看了下是官网给的例子github的代码删了，最后找官网的例子库找到了这个https://nextjs.org/learn/dashboard-app
https://nextjs.org/learn/dashboard-app/getting-started

记得node得是18.8往上，nvm可以支持多个版本的node下载

npm install -g pnpm
npx create-next-app@latest nextjs-dashboard --example "https://github.com/vercel/next-learn/tree/main/dashboard/starter-example" --use-pnpm
cd nextjs-dashboard
pnpm dev

访问：http://localhost:3000/
就是安装成功了
在这里插入图片描述

在这里插入图片描述

相关文章：

Next.js 学习-1

Next.js学习引用：https://www.nextjs.cn/learn/basics/create-nextjs-app 先试试水吧，正好dify用的这个构建的前端项目。使用如果您尚未安装 Node.js，请从此处安装。要求 Node.js 10.13 或更高版本。好吧得用新的了，记得…...

编程日记 2025/9/18 5:31:27

[ComfyUI]Recraft贴图开源方案，实现服装印花自由

一、介绍今天发现了一个简单又好用的插件，可以实现类似Recraft的贴图功能，这是一个作者开发的ComfyUI插件，叫做Comfyui-Transform 这个插件比我们简单的图像覆盖多了一些可控参数，形状、透明度、倾斜、拉升和混合模式等诸多可控…...

编程日记 2025/9/16 8:18:34

JavaScript 数组连接方法

在 JavaScript 中，有多种方法可以连接数组。每种方法都有其自身的优点和缺点。常见的方法包括 concat()、扩展运算符(...)、push()、splice()、slice()、join()、forEach()、reduce() 以及 Array.from() 等。下面是这些方法的详细说明和示例代码。 1. concat() co…...

编程日记 2025/9/13 13:29:28

Windows安装MySQL教程

1.下载下载地址：https://www.mysql.com/downloads/ 下载版本：MySQL Installer for Window 2.安装MySQL 以下只列出需要注意的一些界面，没出现的界面默认继续即可。 1.选择安装类型提供了多种安装模式，包括默认开发版、仅…...

编程日记 2025/9/13 13:29:27

VOS3000线路对接、路由配置与路由分析操作教程

一、VOS3000简介 VOS3000是一款常用的VoIP运营平台，支持多种线路对接和路由配置，适合新手快速上手。本教程将带你了解如何对接线路、配置路由以及进行路由分析。二、线路对接准备工作获取线路信息：从供应商处获取线路的IP地址、端口、用…...

编程日记 2025/9/14 12:36:31

PiscTrace的开发者版

基于 PiscTrace 架构的视图处理的纯开发板，支持静态图片、实时视频流、摄像头视频流和网络视频流的处理。与 PiscTrace 应用版相比，开发者版通过直接的代码开发，提供了更高的灵活性和可定制性，适用于需要深度定制和复杂处理的应用…...

编程日记 2025/9/14 18:56:46

OnlyOffice：前端编辑器与后端API实现高效办公

OnlyOffice：前端编辑器与后端API实现高效办公一、OnlyOffice概述二、前端编辑器：高效、灵活且易用1. 完善的编辑功能2. 实时协作支持3. 自动保存与版本管理4. 高度自定义的界面三、后端API：管理文档、用户与权限1. 轻松集成与定制2. 实时协…...

编程日记 2025/9/13 6:52:14

github 怎么创建一个私有repository 并从另外一台电脑拉取下来更新

1.github上新建一个repository 设置为private tips删除在这点setting 然后往下拖动会有个这里是用来删项目的 2.另外一台电脑拉取这个repository的时候需要配置一个ssh key 这个key的内容生成参考本地电脑的生成然后在这配置 2.1 生成 SSH 密钥（如果还没有…...

编程日记 2025/9/17 9:44:05

本周行情——250222

本周A股行情展望与策略结合近期盘面特征及市场主线演化，本周A股预计延续结构性分化行情，科技成长与政策催化板块仍是资金主战场，但需警惕高标股分歧带来的波动。以下是具体分析与策略建议： 1. 行情核心驱动因素主线延续性&…...

编程日记 2025/9/13 13:29:18

分发糖果(力扣135)

题目说相邻的两个孩子中评分更高的孩子获得的糖果更多，表示我们既要考虑到跟左边的孩子比较，也要考虑右边的孩子，但是我们如果两边一起考虑一定会顾此失彼。这里就引入一个思想：先满足右边大于左边时的糖果分发情况，再…...

编程日记 2025/9/16 9:48:30

QML ToolButton与DelayButton的使用、详解与自定义样式

QML MenuBarItem与MenuItem的使用、详解与自定义样式一、介绍1、ToolButton常见用法基础示例设置图标常用属性texticonenabledshortcutcheckable & checked 信号onClickedonPressed 和 onReleased 样式和外观使用场景 2、DelayButton使用场景核心属性1. delay 核心信号1.…...

编程日记 2025/9/15 4:18:47

动态规划

简介动态规划最核心两步： 状态表示：dp[i]代表什么状态转移方程：如何利用已有的dp求解dp[i] 只要这两步搞对了， 就完成了动态规划的%95 剩下的就是细节问题： dp初始化顺序（有时是倒序）处理边…...

编程日记 2025/9/13 13:29:13

SQL FIRST() 函数详解

SQL FIRST() 函数详解在SQL中，FIRST() 函数是一个用于处理查询结果的聚合函数。它通常与 GROUP BY 子句结合使用，用于返回每个分组中的第一个记录。本文将详细解释 FIRST() 函数的用法、参数、返回值以及与它的关联函数。 1. 函数概述 FIRST() 函数的…...

编程日记 2025/9/13 13:29:11

ClickHouse系列之ClickHouse安装

ClickHouse系列之ClickHouse安装 1 ClickHouse2 Docker安装ClickHouse2.1 docker 启动脚本2.2 默认用户及密码2.3 8123和9000端口的作用2.3.1 81232.3.2 9000 3 Clickhouse连接3.1 命令行客户端连接3.1.1 常见的客户端脚本3.1.1.1 查看数据库：show databases;3.1.1.…...

编程日记 2025/9/13 13:29:09

大模型监督微调（SFT）技术解析

大模型监督微调（SFT）技术深度解析一、基本知识介绍监督微调（Supervised Fine-Tuning）是连接预训练与具体应用的关键技术层。其本质是通过特定任务的标注数据，在保持预训练模型核心能力的前提下，调整模型…...

编程日记 2025/9/13 13:29:08

PTA：有序顺序表的合并

请设计一个能够将有序顺序表LA，LB进行合并的算法，要求合并后的顺序表LC依然有序。例如： LA的元素 1 3 5 7 LB的元素 2 4 LC的元素 1 2 3 4 5 7 其中，LA和LB的长度不超过1000，当中的元素为非递减排序。输入格式: 第…...

编程日记 2025/9/13 13:29:06

Vuetify解决与旧版浏览器（如Internet Explorer 11）的兼容性问题‌

简介由于Vuetify使用了ES2015/2017的特性，这些特性在旧版浏览器中可能不被支持，因此需要通过配置来确保这些特性能够被正确转换。配置1 在项目项目根目录下的vue.config.js文件，或nuxt.config.ts中，添加 transpileDependencies …...

编程日记 2025/9/15 4:27:58

android，flutter 混合开发，pigeon通信，传参

文章目录 app效果native和flutter通信的基础知识1. 编解码器一致性和完整性，安全性，性能优化2. android代码3. dart代码 1. 创建flutter_module2.修改 Android 项目的 settings.gradle，添加 Flutter module3. 在 Android app 的 build.gradl…...

编程日记 2025/9/16 5:30:47

Shell文档归档、压缩与解压

Shell文档归档、压缩与解压 1、文件归档与压缩2、zip、gzip与tar指令2.1、zip指令2.2、gzip指令2.3、tar指令 1、文件归档与压缩归档文件是指将一组文件或目录保存到一个文件中；压缩文件是指将一组文件或目录按照某种存储格式保存到一个文件中，所占磁盘…...

编程日记 2025/9/17 12:25:08

【Bluedroid】AVRCP 连接源码分析（一）

一、AVRCP协议简介 AVRCP（Audio/Video Remote Control Profile）是蓝牙协议栈中的一个重要部分，它定义了蓝牙设备之间的音视频传输控制的流程和特点。AVRCP使得用户可以通过一个蓝牙设备（如手机）远程控制另一个蓝牙设备（如蓝牙耳机或音箱）上的音视频播放，如播放、暂停、…...

编程日记 2025/9/17 23:08:51

CMake入门

1.什么是CMake Makefile想必大家都不陌生吧，它能够解决我们的自动化编译问题，大多是IDE软件都集成了make，譬如 Visual C的 nmake、linux 下的 GNU make、Qt 的 qmake 等等。不同的IDE所集成的make工具所遵循的规范和标准都不同，也…...

编程日记 2025/9/13 13:28:57

基于vite6创建项目

pnpm create vue vite已自动配置路径，在.config.js jsconfig.json 中按需引用element-plus 官网中有 pnpm install element-plus npm install -D unplugin-vue-components unplugin-auto-import // vite.config.ts import { defineConfig } from vite import Aut…...

编程日记 2025/9/14 6:29:36

简单封装一个websocket构造函数

问题描述最近维护一个老项目，发现项目中有大量重复代码，特别是websocket的调用这一块，同样的代码复制了十几个页面，于是自己封装了一个websocket调用的构造函数。 export default class CreateWebSocket {constructor(url) {//…...

编程日记 2025/9/13 13:28:54

大模型产品Deepseek（八）、数据嵌入+知识库管理+联网搜索，实现精准的知识查询

如何将数据嵌入到DeepSeek中以实现精准的知识查询 1. 目标 DeepSeek是一个强大的基于大模型的知识查询工具，能够通过数据嵌入和智能查询功能提供精确的答案。本文将详细介绍如何在DeepSeek中进行数据嵌入，以便最大化其在实际应用中的价值。 2. 推荐使用的Page Assist插件 …...

编程日记 2025/9/13 3:46:03

探索Vue：数字翻滚动画的实现与优化

在前端开发中，动画效果总能为用户界面增添一抹生动与趣味。今天，我们将深入剖析一个基于Vue 3实现的数字翻滚动画组件，从代码结构到功能实现，再到性能优化，一步步揭开它的神秘面纱。组件概述这个Vue组件名为Number…...

编程日记 2025/9/14 20:36:44

POI pptx转图片

前言 ppt页面预览一直是个问题，office本身虽然有预览功能但是收费，一些开源的项目的预览又不太好用，例如开源的：kkfileview pptx转图片 1. 引入pom依赖我这个项目比较老，使用版本较旧 <dependency><gro…...

编程日记 2025/9/13 13:28:49

力扣LeetCode: 2506 统计相似字符串对的数目

题目： 给你一个下标从 0 开始的字符串数组 words 。如果两个字符串由相同的字符组成，则认为这两个字符串相似。例如，"abca" 和 "cba" 相似，因为它们都由字符 a、b、c 组成。然而，"aba…...

编程日记 2025/9/17 12:27:19

DeepSeek模型量化

技术背景大语言模型（Large Language Model，LLM），可以通过量化（Quantization）操作来节约内存/显存的使用，并且降低了通讯开销，进而达到加速模型推理的效果。常见的就是把Float16的浮…...

编程日记 2025/9/14 21:12:01

如何调整CAN位宽容忍度？

CAN位宽容忍度是指在控制器局域网络（CAN, Controller Area Network）中允许时钟同步的误差范围。这是CAN网络正常通信时的关键因素之一，因为CAN协议依赖位同步来确保多个节点在总线上正确解码数据。CAN位宽容忍度确保节点之间由于时钟偏差或抖…...

编程日记 2025/9/13 13:28:43

Versal - 基础6（Linux 开发 AIE-ML + 自动化脚本解析）

目录 1. 简介 2. 步骤解析 2.1 概览 2.1.1 步骤依赖关系 2.1.2 总目录结构 2.2 Vitis XPFM 2.2.1 Dir 2.2.2 Makefile 2.2.3 vitis_pfm.py 2.3 Kernels 2.3.1 Dir 2.3.2 Makefile 2.3.3 config 文件 2.4 AIE_app 2.4.1 Dir 2.4.2 Makefile 2.4.3 aie 要点 2.…...

编程日记 2025/9/13 13:28:41

乐享数科：供应链金融—三个不同阶段的融资模式

供应链金融是与产业链紧密结合的融资模式，它主要体现在订单采购、存货保管、销售回款这三个不同的业务阶段，并针对这些阶段提供了相应的金融服务。以下是这三个阶段中主要的融资模式及其特点： 供应链金融融资模式主要分为以下几种&#xff1…...

编程日记 2025/9/14 21:04:45

vmware虚拟机Ubuntu Desktop系统怎么和我的电脑相互复制文件、内容

1、先安装vmware workstation 17 player，然后再安装Ubuntu Desktop虚拟机，然后再安装vmware tools，具体可以参考如下视频： VMware虚拟机与主机实现文件共享，其实一点也不难_哔哩哔哩_bilibili 2、本人亲自试过了&…...

编程日记 2025/9/13 13:28:37

【React】React 基础（2）

JSX 是什么 JSX是一种 JavaScript 的语法扩展(extension), 也在很多地方称之为 JavaScript XML, 因为看起就是一段XML语法。它用于描述我们的Ul界面，并且其完成可以和 JavaScript 融合在一起使用； 为什么 React 选择使用 jsx？ React 认为渲…...

编程日记 2025/9/13 13:28:35

DeepSeek接入Siri（已升级支持苹果手表）完整版硅基流动DeepSeek-R1部署

DeepSeek接入Siri（已升级支持苹果手表）完整版硅基流动DeepSeek-R1部署 **DeepSeek** 是一款专注于深度学习和人工智能的工具或平台，通常与人工智能、机器学习、自动化分析等领域有关。它的主要功能可能包括：深度学习模型搜索&…...

编程日记 2025/9/13 13:28:33

ASP.NET MVC AJAX 文件上传

如何使用 MVC 5 和 AJAX（.NET Framework）上传文件。使用AJAX和ASP.NET MVC 上传文件再简单不过了。对于最纯粹的人来说，这不需要使用jQuery。此代码实际上允许上传多个文件。注意：以下代码示例支持 ASP.NET MVC 5。如果使用 .…...

编程日记 2025/9/14 16:31:29

npm使用了代理，但是代理软件已经关闭导致创建失败

如果在关闭前打开了vscode，此时vscode中的终端没有刷新，就会出现这个问题，最开始会一直转圈圈，直到超时，然后出现该报错 ❯ npm create vuelatest npm error code ECONNREFUSED npm error syscall connect npm error …...

编程日记 2025/9/13 13:28:29

Spring Boot定时任务原理

Spring Boot定时任务原理在现代应用中，定时任务的调度是实现周期性操作的关键机制。Spring Boot 提供了强大的定时任务支持，通过注解驱动的方式，开发者可以轻松地为方法添加定时任务功能。本文将深入探讨 Spring Boot 中定时任务的实现原理…...

编程日记 2025/9/13 17:01:40

公文派2025：免费社区版重大安装更新！

大家好，感谢对「公文派」的支持。距离上一次更新已经过去了将近一年的时间，今天我们带来了全新的免费2025社区版，该版本也是目前最新的版本，无需授权即可使用所有的功能。我们先来看下本版本的更新及特色功能聚合多个AI功能…...

编程日记 2025/9/14 7:06:53

Ubuntu24.04LTS的下载安装超细图文教程（VMware虚拟机及正常安装）

😸个人主页👉：神兽汤姆猫 📖系列专栏：开发语言环境配置、 Java学习、Java面试、Markdown等学习上的每一次进步，均来自于平时的努力与坚持。 💕如果此篇文章对您有帮助的话，请点…...

编程日记 2025/9/17 22:49:22

ES6相关操作

一.JavaScript的基础语法 1.Demo1.html <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>JavaScrip…...

编程日记 2025/9/13 13:28:24

【运维】源码编译安装cmake

背景： 已经在本地源码编译安装gcc/g，现在源码安装cmake 下载源码下载地址：CMake - Upgrade Your Software Build System 安装步骤： ./bootstrap --prefix/usr/local/cmake make make install 错误处理 1、提示找不到libmpc.…...

编程日记 2025/9/15 9:43:24

代码随想录_回溯

代码随想录_回溯回溯 77.组合 77. 组合给定两个整数 n 和 k，返回范围 [1, n] 中所有可能的 k 个数的组合。你可以按任何顺序返回答案。思路: 回溯优化: 剪枝注意代码中i，就是for循环里选择的起始位置。 for (int i startIndex; i <…...

编程日记 2025/9/13 13:28:20

tauri2实现监听记住窗口大小变化，重启回复之前的窗口大小

要想实现记住窗口大小的功能，整体逻辑就是要监听窗口大小变化，将窗口大小保存下来，重启之后，读取保存的大小，然后恢复。这里可以使用rust层实现，也可以在前端实现。我这里就纯rust层实现了。监听窗口变化…...

编程日记 2025/9/13 13:28:18

番茄工作法html实现

对比了deepseek-r1-online和本地部署的14b的版本，输出的输出的html页面。在线满血版的功能比较强大，可以一次完成所有要求。14b版本的功能有一些欠缺，但是基本功能也是写了出来了。 input write a html named Pomodoro-clock which “hel…...

编程日记 2025/9/16 7:18:15

C++：dfs，bfs各两则

1.木棒 167. 木棒 - AcWing题库乔治拿来一组等长的木棒，将它们随机地砍断，使得每一节木棍的长度都不超过 5050 个长度单位。然后他又想把这些木棍恢复到为裁截前的状态，但忘记了初始时有多少木棒以及木棒的初始长度。请你设计一个程序…...

编程日记 2025/9/13 13:28:14

【ORB-SLAM3】鲁棒核函数的阈值设置

问题背景阈值 δ \delta δ 是 Huber 鲁棒核函数的重要参数。首先给出结论，在ORB-SLAM系列中，该阈值选取的原则为： 单目情况下，根据95%置信水平下两自由度卡方检验的临界值， δ \delta δ 设置为 5.991 \sqrt{5.9…...

编程日记 2025/9/16 9:09:55

四种常见图形库GLUT，SDL，SFML和GLFW简介

GLUT、SDL、SFML 和 GLFW 是四种常用的库，用于管理窗口、输入和上下文创建，通常与 OpenGL 结合使用以实现图形渲染。以下是它们的详细介绍、常用应用场合和具体案例。 1. GLUT（OpenGL Utility Toolkit） 简介 GLUT 是一个用于创建…...

编程日记 2025/9/13 9:01:01

C++类和对象进阶：初始化列表和static成员深度详解

C类和对象：初始化列表和static成员深度详解 1. 前言2. 构造函数初始化成员变量的方式2.1 构造函数体内赋值2.2 初始化列表2.2.1 初始化列表的注意事项 2.3 初始化列表的初始化顺序 3. 类的静态成员3.1 引入3.2 静态成员变量3.3 静态成员函数3.4 静态成员的注意事项3…...

编程日记 2025/9/12 19:23:40

[C#]C# winform部署yolov12目标检测的onnx模型

yolov12官方框架：github.com/sunsmarterjie/yolov12 【测试环境】 vs2019 netframework4.7.2 opencvsharp4.8.0 onnxruntime1.16.3 【效果展示】【调用代码】 using System; using System.Collections.Generic; using System.ComponentModel; using System.…...

编程日记 2025/9/15 14:52:53

阿里云k8s服务部署操作一指禅

文章目录 DockerFile镜像操作阿里云k8s服务部署 DockerFile # 使用 JDK 17 官方镜像 # linux架构：FROM --platformlinux/amd64 openjdk:17-jdk-slim # arm架构：openjdk:17-jdk-slim FROM --platformlinux/amd64 openjdk:17-jdk-slim# 设置工作目录 WORK…...

编程日记 2025/9/16 8:12:28