今年

今天学了 react,next,material 。
明年打算用 react+next+material+goframe,写一个后台管理系统，再写一个阅读网站，挂广告。

学技术吧，让他学自己喜欢的，不管多难都要搞自己喜欢的，不要浪费自己的生命。

1. 房贷还完
2. 每天坚持学英语一年
3. 在女神的影响下意识到专注持续地做一件事情才是最有用的。

goframe ，用了就停不下来了。 https://goframe.org/display/gf

将你的个人电脑系统换成 linux ，学习最快。

react,nextjs,SWR,react-bootstrap,react-toastify,react-use-websocket...真的不错。
组件方式写页面很爽，全都封装成对象来处理，各种组合调用。不过在选择到底用服务端渲染还是客服端渲染时要仔细一点。

想象一下，一个取消和提交的 button 按钮封装成一个组件对象，在你的所有页面中，你想要用都可以调用，而且你要换样式或加什么其他东西，在这个组件里面进行修改，所有你用到的都会改变，那不很舒服，而且代码少很多。

用 goframe 吧

```
func (m *roleMenu) List(page int, size int, id string, rid string, mid string) (int, gdb.List) {
db := g.DB().Model(dao.RoleMenu.Table + " t1").
LeftJoin(dao.Role.Table + " t2 on t1.rid = t2.id").
LeftJoin(dao.Menu.Table + " t3 on t1.mid = t3.id")
if id != "" {
db = db.Where("t1.id", id)
}
if rid != "" {
db = db.Where("t1.rid", rid)
}
if mid != "" {
db = db.Where("t1.mid", mid)
}
count, _ := db.Count()
db.Fields("t2.name r_name,t3.name m_name,t1.id id")
all, _ := db.Limit(size).Offset((page - 1) * size).Order("t1.id desc").All()
if all.IsEmpty() {
return count, gdb.List{}
}
return count, all.List()
}
```

@find456789
@wequart
@dany813
@codexian
多谢大家的回复，我想了一下，后台 cms 没必要服务端渲染，使用 SWR 客服端渲染就好了。一开始就不应该使用服务端渲染，没办法刚学 react 是要走点弯路。。

@wiluxy 浏览器刷新后会从服务端重新渲染，在服务端时拿不到 localStorage 里面的数据。

Layout.js 里面获取 user 数据时，刷新 user 就会出现 undefine ，代码如下，请问这个问题如何处理呢？
```
import Meta from "./Meta";
import {Container, Nav, Navbar, NavDropdown} from "react-bootstrap";
import {useContext} from "react";
import {UserContext} from "../utils/userContenxt";
import jsCookie from "js-cookie";
import Router from "next/router";

export const Layout = ({children}) => {
const {user} = useContext(UserContext)
if (user === undefined) return (<>
<Meta/>
<Container>{children}</Container>
</>)
const {menu} = user

function handleLogout() {
localStorage.removeItem('u')
jsCookie.set('token', '')
Router.push('/login')
}

return (<>
<Meta/>
<Navbar collapseOnSelect expand="lg" bg="dark" variant="dark">
<Container>
<Navbar.Brand href="#home">React-Bootstrap</Navbar.Brand>
<Navbar.Toggle aria-controls="responsive-navbar-nav"/>
<Navbar.Collapse id="responsive-navbar-nav">
<Nav className="me-auto">
{menu.map(item => (<NavDropdown key={item.id} title={item.name} id="collasible-nav-dropdown">
{item.Children.map(item => (item.divide === 1 ? <NavDropdown.Divider/> : <NavDropdown.Item onClick={() => Router.push(item.path)}>{item.name}</NavDropdown.Item>))}
</NavDropdown>))}
</Nav>
<Nav>
<Nav.Link eventKey={2} href="#memes">
{user.u.uname}
</Nav.Link>
<Nav.Link onClick={() => handleLogout()}>退出</Nav.Link>
</Nav>
</Navbar.Collapse>
</Container>
</Navbar>
{children}
</>)
}
```

https://react-bootstrap.github.io/ 不错的

找到答案了

```
import Router from 'next/router'

Router.push('/')
```

ubuntu 系统也不错的。

@summerwar
@chocotan 那能取到 70%吗 也是 1723.246

看了下 菜鸟教程一个月的 pv 是 1500 万以上，按 1000 万算的话，每年 $259200 （ 1657065.60 元）> 每月 138088 元

相当于菜鸟教程每月广告费都 13 万 。这样算没问题吧。

朋友现在发现的怎样呢

骑行

@cs010 完美~