RSS订阅原创 Vite创建React项目，另外一种更加简单的方法
参考《React 18 Design Patterns and Best Practices Design, build, and deploy production-ready web applications with React》4th 第一章倒数第二节Vite as a solution有个脚手架工具。在上一篇blog中一个一个安装依赖dependencies，有没有一步到位的方法呢，有!2.创建项目my-react-app，指定模板为ts版的react，更多模板可看。3.cd到目录里&安装依赖。
2023-11-08 22:44:09
417
原创 跟着森老师学React Hooks(1)——使用Vite构建React项目
以往的React项目的初始化方式大多是通过脚手架create-react-app(本质是webpack)，其实比起Vite来构建，启动会慢一些。创建一个目录shop-cart，使用vscode打开，在目录下依次运行(用yarn 也行)所以这次跟着B站的一个教程，使用Vite来构建一下React项目(Node版本。5. 根据如下文件结构去新建文件和文件夹(暂时忽略server.js，现在为空)Vite是一款构建工具，对ts有很好的支持，最近也是在前端越来越流行。1.初始化一个node项目shop-cart。
2023-11-08 22:16:30
612
原创 NodeJS回调地狱及Promise优化
然后调用Promise.all，第一个参数是个Promise对象数组。如果全部成功，就会到.then中的data去，data是各个promise resolve的结果数组，这里打印[ '1', '2', '3' ]；这样虽然是按序输出了，但是代码嵌套了，如果有更多文件，且读取后的处理逻辑更加复杂，整个代码的可读性就变得很差。现在有这样一个需求，分别读取abc三个txt文件(文件内容分别是1, 2, 3，文件路径和js文件路径相同)，函数本身比较简单，三个参数分别是文件路径，数据编码和回调函数。
2023-10-30 00:32:31
306
原创 Linux shell 从文本文件读取文件列表循环拷贝
先抛出问题，有一个文本文件(files.name)列出哪些文件要拷贝，一行一个(可以带路径)
2023-10-26 10:10:12
425
原创 使用webpack建立React+TS项目
之前写过类似的文章，这次看到一本新书里也介绍了这个知识点，故尝试之。6.安装webpack。7.配置webpack。
2023-08-06 18:17:18
1284
原创 Node.js 中使用fetch 按JSON格式发post请求
最近在测试一个api，可以用curl命令直接访问，指定header相关配置，request body(JSON)，成功后返回一个JSON。原本想搞个静态页面html，在script标签里用fetch做个简单的demo的，结果就遇到跨域问题。低版本用node-fetch库或者原生的http模块, node-fetch我自己导入一直有问题，原生http模块要写不少东西，故不采用。选择新版本的Node，不能低于17.5.0，否则不能直接使用fecth，这。5. VSCODE编辑。既然有现成的工具，那就使用呗。
2023-03-24 11:26:11
1842
1
原创 Linux部署tomcat服务器流程(Redhat+OpenJDK11+Nginx)
紧接着两个ssl证书项目，一个私钥，一个公钥，也就是https证书项，配置它们的路径，这个网上相关的教程很多也不赘述；设置好后保存退出，使用sudo systemctl reload nginx.service重启nginx，如果失败且查看问题遇到“BIO_new_file() failed (SSL: error:8000000D:system library::Permission den>”这样的错误，说明linux安全做了限制，参考。需要一台Linux server，我这里使用的是redhat9。
2023-03-17 21:16:32
1116
原创 新版本Eclipse+JDK 创建项目tip
最近又有项目要用java传统那一套写，配了下环境，做个笔记环境为OpenJDK11+Eclipse for j2ee(2021年9月版)+Tomcat10目标，将一个简单helloworld servlet程序打包成war包1.Eclipse安装后配置jdk版本和字符编码(菜单栏Windows->Preferences里设置)，后面还要设置Maven(jre要用命令生成了)2.原来的Servlet相关的包由javax更新为jakarta，所以依赖也不一样了，展示下pom文件，项目名为folder-porta
2022-12-04 19:20:04
378
原创 React学习笔记002-React中的事件
在原生html中的定义一个简单事件一般是这样: <button onclick="alert('777')">按钮</button>这是原生事件，将click事件直接绑定在button(dom)上面；而React的jsx语法采用合成事件，也就是采用事件冒泡的形式冒泡到document上面,然后React将事件封装给正式的函数处理运行和处理。function App() { const handleClick = () => alert("777");
2022-05-09 23:09:16
245
原创 React学习笔记000-使用webpack自定义搭建React环境
React官网Web编程环境体验推荐两个codesandbox 和 stackblitz最新直访url(当前版本React18):https://codesandbox.io/s/react-newhttps://stackblitz.com/edit/react-ts-rwegse除了传统的create-react-app脚手架的方式，现尝试使用webpack构建react项目(实际脚手架创建的项目内置了webpack)，这样自己手动构建一遍方便知道细节。1.创建一个空目录we
2022-05-04 23:55:25
544
原创 centos8安装mysql8
1.先切换root用户/或者命令前加sudo再输密码也行2.检查wget是否安装(which wget一下结果为/usr/bin/wget就知道了)，没安装使用下面命令安装yum install -y wget3.使用wget下载本地安装源(想下哪个参考官网，我这里下载mysql80-community-release-el7- ...
2021-10-24 15:56:08
1986
原创 docker学习笔记(1)-docker的安装(ubuntu为例)
最近在培训springcloud相关的知识，作业中有用到docker，就对着教程把相关东西搭建起来。在这里做个笔记。 1.首先访问docker官网，点击右上角Get Started，选择菜单栏中的Developers，点击docs: 2.网站会新打开一个页面，选择前两个进入就好，或者直接在搜索框内搜索:3.顺着点击基本都到这里:然后照着命令来就是：...
2021-07-09 22:10:59
178
6
原创 Win10下使用ssh连接工具(MobaXterm)连接VirtualBox中的Linux(以Ubuntu为例)
因为在本地需要一个Linux环境，所以我就在VirtualBox上安装一个Ubuntu来做测试。不过在虚拟机里面操作控制台比较麻烦，传文件啥的也麻烦(可以配置，就设置个共享目录，但是个人感觉还是麻烦)，所以就想到用ssh连接工具来连接。 准备:1. 你需要一台Linux虚拟机，我装的是Ubuntu18; 2. 下载一个ssh连接工具(类似的有很多，我推荐MobaXterm个人版)； 开始我们的配置 首先在虚拟机中打开ter...
2021-04-21 17:56:13
2202
原创 docker配置镜像加速器
起因: docker pull centos 命令从镜像仓库(在国外)拉取镜像比较慢，所以需要配置国内镜像加速器. 步骤1. 访问阿里云并登陆，可直接百度搜索，进入后可能需要登录； 步骤2. 依次选择选择产品-> 容器与中间件-> 容器镜像服务ACR：步骤3. 选择管理控制台：步骤4. 叉掉并选择镜像服务器:步骤5. 根据自己的系统选择操作文档，按上面的指示来完成剩余步骤：可以看到速度起飞:...
2021-01-30 22:02:52
237
原创 常用的第三方api汇总[获取天气]
这里mark一下自己经常用第三方api，非商用，适合自己学习测试使用(例如js里的fetch)，不要恶意访问，后续会慢慢补充。 1. 随机用户(GET请求, JSON格式)。https://api.randomuser.me/?nat=US&results=1 results表示获取用户个数，也就是数组字段results的长度，默认为1；nat应该是国家简称，好像设置了也没啥用。2.中国天气(GET请求, JSON格式)http://wthrcdn.etouch...
2020-12-06 16:02:46
3624
3
原创 React hooks学习笔记(7)——useCallback&useMemo
useCallback:在组件中定义事件回调或者是某些函数处理时选择使用useMemo(memory记忆):根据已有状态计算某些数据并且计算过程较消耗性能时选择使用下面直接demo演示，还是components下新建一个CallbackMemoDemo.js并在App.js中将其引入:import React from 'react';export default function CallbackMemoDemo() { return <div> Ca
2020-11-14 00:08:58
228
原创 React hooks学习笔记(6)——useRef
ref是reference的缩写，译为引用。直接看demo，还是老样子创建一个RefDemo.jsimport React from 'react';export default function RefDemo() { return ( <div> refDemo </div> );}，并在App.js中将其引入:...import RefDemo from "./components/
2020-11-13 23:16:25
230
原创 React hooks学习笔记(5)——自定义hooks
直接看demo，在components下新建HooksDemo.js:import React from 'react';const MOCK_DATA = [ { name: "zhangsan", age: 18 }, { name: "lisi", age: 10 }];export default function HooksDemo() { return ( <
2020-11-13 22:40:28
443
原创 React hooks学习笔记(4)——useContext
useContext，直译为使用上下文，作用是深层值传递，直接看例子:components下新建一个ContextDemo.js(父子关系：ContextDemo > Demo > Child):import React from "react";const Demo = props => { return <div> <Child /> </div>}const Child = () => ..
2020-11-11 21:51:13
284
原创 React hooks学习笔记(3)——useReducer
useReducer是redux的hooks用法，直接通过demo演示。components目录下新建ReducerDemo.js:import React, { } from 'react';export default function ReducerDemo(props) { return ( <div> reducer</div> );}在App.js中引入:...import ReducerDemo from "./c.
2020-11-11 20:41:30
197
原创 React hooks学习笔记(2)——useEffect
effect中文译为效果、影响。而useEffect在React中一般用于一个组件中的某个或某些个state或props发生改变时，组件所要产生的变化或者响应。通俗来说就是监听组件的一个或多个变量(state或者父组件传来的变量)，当变量改变时，useEffect里的语句便会执行。 在前面代码的基础上，现在有个需求，就是每当count为偶数时，就在控制台打印一下: 1.类组件ClassComp.js修改为:import React, { Component } from '...
2020-10-27 00:02:18
697
1
原创 React hooks学习笔记(1)——useState
函数式组件是当前React主流写法，最近在项目里一直遇到，今天结合B站的教程记录一下自己的学习体会。 1. 直接就demo来讲吧，首先初始化react项目(好像得用yarn初始化了)create-react-app react-hooks-action 完事之后在package.json里看下react版本，确保大于16.82. 把一些不重要的文件删掉，src下创建一个components目录并在此目录下创建两个文件，一个用于展示传统的类组件ClassComp.js，...
2020-10-24 17:58:20
281
原创 cloudant 免费版初体验
这里使用的是IBM提供的免费版，1G大小，放在远端的云上。它非常适合用于个人学习，测试和轻度开发。先去官网，右上角注册个账号，百度搜索IBM cloudant，第一个就是，用普通的邮件163，qq都行:注册好后登录：创建资源，搜索cloudant：点进去后就是选择的配置了，能选的不多，地点我选了比较近的东京，实例名自起，plan就选free版:选完后Create就行，完成后能看到实例:点击它就进入到这个实例的管理详情页:点击Launch Dashbo.
2020-09-12 23:42:20
512
原创 NoSQL型数据库——MongoDB体验(004)——NodeJS通过mongoose连接到MongoDB
mongoose是nodejs连接到MongoDB server的一个ODM库，或者说中间件，类似于java连mysql的那个connector。和ORM类似，ODM是对象文档模型的缩写，因为MongoDB是基于文档的数据库，而不是基于关系。mongoose比nodejs自带的mongoDB驱动更容易使用，它将读到的文档parse为Object，方便js做操作。mongoose提供了Schema(约束了数据库的文档结构)，Model(相当于collection，作为集合中的所有文档的表示)，Docu...
2020-09-12 22:55:23
206
原创 NoSQL型数据库——MongoDB体验(003)——MongoDB图形管理工具
MongoDB shell不好操作，来试试GUI工具吧。这里选择mongodbmanager，下载地址选择free版:下载后直接安装就行，下一步下一步。这两个拓展可以勾上安装完成后弹出框，选accept就行，然后界面成这样:如果是本地，端口也没设置修改，点击OK即可:展开后可以看到刚才创建的main库和students集合，点击菜单栏黑色框标可以启动shell:一下子插入了两条内容相同的数据，不过id不一样。还可以右击地下的记录，删除对应do.
2020-09-12 17:11:19
195
原创 NoSQL型数据库——MongoDB体验(002)——MongoDB 简单使用
首先MongoDB由数据库（database）、集合（collection）、文档对象（document）三层次组合，这三个概念对比关系型数据库的话，类似数据库，表，单条记录(元组)，是一级级的包含关系。现在通过mongo命令打开mongo shell，运行命令:1.show dbs/databases :显示所有数据库2.use [数据库名] :进入或切换到指定的数据库中(在MongoDB中，数据库和集合都不需要手动创建，当我们创建文档时，如果文档所在的集合或数据库不存在会自动创...
2020-09-12 15:47:19
151
原创 NoSQL型数据库——MongoDB体验(001)——MongoDB 最新版4.4.1下载安装
MongoDB是一个文档型的NoSQL数据库。所谓NoSQL，直译就是没有SQL，或者Not Only SQL。是区别于类似MySQL、Oracle这种关系型数据库的数据库(主要就这两大类)。它更加灵活，存储格式的是类JSON的文档，而不是传统关系型库的那种row、column表。其优点是简单，自由，快速，个人认为适合那种表结构经常变动(需求变动)的情形。 1.首先是安装，很容易访问MongoDB官网(可以看看首页介绍)。由于是个人使用，我们这里选择下载社区版:2.就选择当...
2020-09-12 12:52:43
473
2
原创 Java网络编程基础003—URL
URL(Uniform Resource Locator)，统一资源定位器，用来标识www上某个信息资源，是一种定位资源的主要访问机制的字符串。URI(Uniform Resource Identifier), 统一资源标识符，用来标识抽象或物理资源的一个紧凑字符串URN(Uniform Resource Name), 统一资源名称，通过特定命名空间中的唯一名称或ID来标识资源。关系: URI = URL + URN， 即URL是URI的子集一个标志的URL必须包括：protocol...
2020-07-05 17:09:29
202
原创 Java网络编程基础002—端口
既然IP用来标识计算机，那么什么来标识计算机上的网络应用程序？答案是端口。端口是一个虚拟的概念，是16位二进制正整数，故取值为0-65535(十进制)。端口一共可以在一台计算机上存在12w+(2^17)个，因为端口属于传输层，传输层有两个重要协议(TCP和UDP)，所以两边各65536个(2^16)。一般来说端口够用，因为计算机上用不到12w多个网络应用。 端口0-1023为知名端口，也叫公认端口，比如20,21(ftp), 22(SSH), 80端口(http), 443(https)...
2020-07-05 09:36:33
381
原创 Java网络编程基础001——获取IP和主机名
IP地址是网络中某个节点标识, 这个节点可能是计算机, 路由, 通讯设备. 下面这个Demo非常简单, 把它当作Java网络编程的起点.import java.net.InetAddress;import java.net.UnknownHostException;public class Main { public static void main(String[] args) throws UnknownHostException { InetAddress addr = InetAd
2020-07-05 08:47:48
381
原创 IDEA + Maven JavaWeb基本开发环境搭建
确保你的机器上Java8+已经安装好且环境变量配置好。下载到jetbrains官网下载IDEA(个人使用我推荐社区版) 安装过程比较简单，中间就一个选择64bit(你得是64位操作系统)，其它的默认下一步即可(那些插件要用就选，不用就不选，一般是不选)。 安装maven: Windows的下载apache-maven-3.6.3-bin.zip这种即可，下载后解压...
2020-04-21 22:05:56
694
原创 用Java开发一个简单的文本文件字符串替换程序
之前有写过几篇Spring的入门笔记，不过都是手动导jar包，这种方式比较原始。现在主流是Maven，以后可能会是Gradle! IOC的原理基本是反射。项目中原来需要手动new的对象交由IOC容器来创建，容器还管理项目中各种bean的依赖关系。 首先是创建一个maven项目，...
2020-03-27 11:37:44
804
原创 点击列表中的哪一项, 那么该项的文字变成红色 Vue小练习
看Vue学习视频中看到这个小练习，如title。实现如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Homework</title> <style> .showRed{...
2020-03-23 16:13:46
1341
1
原创 Vue从入门到放弃笔记(3)——使用脚手架开发vue项目
对比React的脚手架工具react-cli， Vue也有一套脚手架工具vue-cli，赶紧来体验一下吧!1.首先下载这个脚手架工具(前提把npm或cnpm配好 参考，不然下载就会蛋疼)——打开控制台，运行如下命令:npm install -g @vue/cli2.使用脚手架创建项目——运行如下命令(假设项目名为"hello-world"，preset初学选"default"就行...
2020-01-31 17:00:58
227
原创 我的2019年总结
不知不觉已经2020年了，突然想在这新的一年做点什么了:(。 首先感谢关注我的各位fans们，我并不优秀，所以我的fans数达到100(github上的几个stars)是受宠若惊。同样也感谢为我博文点赞的, 评论的(好的不好的)朋友，也感谢看过或者只是刷过我博客的。在CSDN上有你们，很好! 我目前浏览数最高(点赞也最多)的居然是"ASP.NET WebForm 登录"...
2020-01-07 23:43:05
224
原创 122. 买卖股票的最佳时机 II
题目:给定一个数组，它的第i 个元素是一支给定股票第 i 天的价格。设计一个算法来计算你所能获取的最大利润。你可以尽可能地完成更多的交易（多次买卖一支股票）。注意：你不能同时参与多笔交易（你必须在再次购买前出售掉之前的股票）。示例:输入: [7,1,5,3,6,4]输出: 7解释: 在第 2 天（股票价格 = 1）的时候买入，在第 3 天（股票价格 = 5）的时候卖出, ...
2019-12-14 22:42:02
191