从零全栈开发Web项目

Java Web开发的学习记录

后端


Spring Boot

配置项

application.properties 或者yaml

1
server.port=8080   #比如配置端口

注释

页面跳转

1
2
3
4
@RequestMapping(value = "/", method = RequestMethod.GET)
public String home() {
return "index.html";
}

响应http请求

1
2
3
4
5
6
@RequestMapping(value = "/getKubots", method = RequestMethod.POST)
@ResponseBody
public String getKubots(){
String result = JSON.toJSONString(RedisService.BuildKubots());
return result;
}

spring-boot-websocket

This guide walks you through the process of creating a “hello world” application that sends messages back and forth, between a browser and the server. WebSocket is a very thin, lightweight layer above TCP. It makes it very suitable to use “subprotocols” to embed messages. In this guide we’ll dive in and use STOMP messaging with Spring to create an interactive web application.

前端


html

都是一个个的标签,或者说dom元素

导入库或者js

1
2
3
<script src="js/lib/fabric.js"></script>
<script src="webjars/stomp-websocket/stomp.min.js"></script>
<script src="webjars/jquery/jquery.min.js"></script>

JavaScript

弱类型,解释性语言

只有两种数据类型

  • let
  • const

#重复执行的两种方式

  • setTimeOut(function, timeout)
  • requestAnimationFrame(callback)

jquery

ajax

发送http请求

1
2
3
4
5
6
7
8
9
10
$.ajax({
url: "getKubots",
type: "POST",
success: function (data) { //成功的回调
...
},
error: function (data) {
...
}
});

fabricjs

canvas library

Canvas allows us to create some absolutely amazing graphics on the web these days. But the API it provides is disappointingly low-level. It’s one thing if we simply want to draw few basic shapes on canvas and forget about them. But as soon as there’s need for any kind of interaction, change of picture at any point, or drawing of more complex shapes — situtation changes dramatically.
Fabric aims to solve this problem.