百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 技术文章 > 正文

搭建自己的前端服务器环境—Node、MySQL、Git和Nginx等一网打尽

nanshan 2025-01-18 22:51 7 浏览 0 评论

前言

作为前端开发者一直都在关注浏览器的行为、表现。但是时间长了免不了要接触到后端的知识、服务器的知识。尤其是在前端技术爆发式发展的当下,前端慢慢的渗透到了更多的领域。比如,使用 express/koa 创建 http 服务,使用React-Native开发Android和IOS通用的APP,甚至使用node开发系统、嵌入式程序等。这个时候,我的内心开始蠢蠢欲动,我们能做的不仅仅是网页。虽然我是个前端,但是我有一颗全栈的心啊,正好之前入手了阿里云的服务器,这周闲来无事,折腾起来。

创建自己的服务器

我这里推荐使用云服务器,相比使用自己的服务器,云服务器有很多方便的地方,而且云服务器提供一个一周的试用版,用起来非常的方便。

创建一个轻量级的服务器 阿里云可以购买一台可使用一周的服务器,这个服务器正好用来做这次开发(已有的请跳过)。

登录阿里云,进入购买 CES 的地方,链接地址如下:

https://www.aliyun.com/[1]

依次选择:

?计费方式:包年包月。

?地域:华北5(当前华北5有优惠)。

?实例:请寻找1vCPU、1G内存的实例(我最终选择了突发性能实例 t5)。

?镜像:选择CentOS 7.4 (现在后端普遍使用6+的版本,7相比6有了很大改进,前端选择7可以减少很多麻烦),勾选安全加固。

?云盘:40G高效云盘。

?公网带宽:勾选自动分配公网 IP,选择1M带宽。

?安全组:选择默认安全组,并勾选http80端口和http443端口。

?购买周期:选择1周。

最终结果:



我们的服务器主要做网站类的开发,所以有针对性需求的用户可以考虑将内存增大,其他在需要的时候采取考虑。

安装自己的开发环境

Windows连接到服务器

Linux服务器不像window那样有一个可视化的界面,window/mac连接的时候也不像远程桌面那样方便。这里连接服务器需要使用命令才行。

window连接服务器 好消息是window下有一款神器:xshell,命令可以很方便的输入到一台服务器或者多台服务器上,用户密码也可以很方便的保存在本地,多个服务器还可以分组,你要做的就是专注于眼前的服务器开发。

这个软件可以直接百度下载。

?首先你需要安转一个xshell,下载需要填一些信息,安装非常简单,要注意的是安装的时候需要选择个人开发使用,不然安装好之后发现需要交钱才能用就坑了。



?安装好之后你就可以把自己的服务器ip、用户名、密码都填好了,以后只需要鼠标一点就进入了自己的服务器了。



?需要注意的是,选择一下默认的字符,不然你的中文会变成乱码。



?连接之后的界面是下面这样。



?首先有一个进入服务器的提示,然后下面就是熟悉的命令行了,不同的是前面那段显示的规则是用户名@机器名。

Mac连接服务器

Mac连接服务器可以使用自带的终端应用,也可以自己下载一个iTerm2,这里我推荐使用iTerm2,可以方便的使用不同的主题,添加各种有用的插件。

?打开iTerm2,输入连接命令ssh 用户名@ip地址然后回车,你会看到提示你输入密码,这个时候输入你在购买服务器的时候设置的密码就好了。



?只要密码正确,你就可以进入服务器了,依旧是熟悉的命令行模式。



?你会在第一时间看到服务器反馈的上次登录信息,欢迎信息,然后是命令行的提示,前面的显示规则是用户名@机器名。

几个常用的命令 要想使用Linux系统服务器做开发,不懂几个常用命令怎么行?

?ssh 用户名@ip,连接服务器的命令。

?cd 绝对路径/相对路径,跳转到路径对应的目录下。

?rm 文件名,删除文件。

?rm -rf 目录路径,删除目录以及目录下的所有文件,谨慎操作!

?ls [-a],查看当前目录下的文件和目录,加-a参数可以查看所有文件,包括隐藏文件(.开头的文件是隐藏文件,默认是看不见的)。

?ll,查看当前目录下的文件详情,可以文件的权限,遇到没有权限执行的情况下可以使用这个命令查看。

?pwd,查看当前路径的完整路径,不知道自己在哪儿的时候可以使用这个命令查看。

?which 名字,在几个默认位置查找改名字,比如查找pm2安装在哪个地方了。

?mkdir 目录名,创建一个空目录。

?cat 相对/绝对文件路径,查看文件的内容,多为查看日志或者其他文本文件。

?cp 文件路径 目标路径,复制一个文件到另外一个地方。

?mv 文件路径 目标路径,移动一个文件到另外一个地方,也可以重命名。

?ps -aux,显示当前进程,有时候需要用这个查看进程是否存活。

?kill -9 进程id,结束进程,进程id就是上一条命令查到的pid。

?tar -zxvf 文件,解压缩文件。

?tar -zcvf 压缩后的文件 要压缩的文件/目录,压缩文件。

?vi 文件路径,使用vim进入文件的编辑模式。

?vi退出文件,按下esc键保证退出编辑模式,输入:q或者:q!强制退出。退出保存输入:wq

?vi编辑,按下i左下角会提示进入编辑模式,然后就是正常的输入文字,再按esc键退出编辑模式。

?vi保存编辑结果,按下esc键保证退出编辑模式,输入:x保存并退出

安装Node

1.推荐安装最新的稳定版。我这里是10.15.3,下载地址如下: https://nodejs.org/en/download/[2]

2.选择Source Code后面的那一行,右键复制链接地址,我们使用源代码的方式安装,第一次安装的时候使用这种方式好处多多。



3.回到服务器,首先跳转到根目录下cd /。创建一个空目录,用来放所有的安装包mkdir software。

4.使用命令把刚才的文件下载下来wget https://nodejs.org/dist/v10.15.3/node-v10.15.3.tar.gz。阿里云下载速度比较给力。



5.将下载好的压缩包解压tar -zxvf node-v10.15.3.tar.gz:



6.进入解压好的目录并执行config配置命令cd node-v8.9.4.tar && ./configure


7.在编译代码之前,还需要在机器上安装一些软件包,使得编译可以正常运行: sudo yum install gcc gcc-c++



8.执行编译以及安装命令make && make install,这里编译阶段时间会非常长,你可以喝杯茶,真的超级长,别怪我没提醒你。编译成功后执行npm -v和node -v测试是否安装成功。


安装MySQL

mysql是一个方便使用的开源数据库。因为使用简单,安装方便,功能强大,受到很多开发者的喜爱,给自己安装一个MySQL数据库真的是非常有必要的,利用它可以存储不少东西。

1.下载安装需要用到的源:

wget http://repo.mysql.com/mysql-community-release-el7-5.noarch.rpm[3]

2.安装下载的源rpm -ivh mysql-community-release-el7-5.noarch.rpm

3.下载安装MySQL:yum install mysql-server

4.使用service mysqld start

5.使用命令修改当前用户的密码(默认root是没有密码的):mysqladmin -u root password '密码',这里我设置的密码为root

6.使用命令进入数据库:mysql -u root -p



7.这个时候数据库已经安装好了,但是只能在服务器上看。我们需要让MySQL运行远程连接,这样方便我们调试,不用每次都要使用命令行。

8.进入服务器的mysql命令行模式下,输入GRANT ALL PRIVILEGES ON . TO 'root'@'%' IDENTIFIED BY 'password' WITH GRANT OPTION;其中root代表的是这次要修改的用户名,password代表这个用户使用的密码,然后再输入flush privileges;让命令生效。需要注意的是每行命令的最后要加;,不然是不会执行的。

9.如果顺利,这个时候已经是修改完了,你可以输入查询命令来看看最终的结果。SELECT DISTINCT CONCAT('User: ''',user,'''@''',host,''';') AS query FROM mysql.user;。也可以通过软件直接登录数据库看看。



10.到此MySQL数据库就完成安装了,这个时候可以使用某个客户端连接上数据库看了(推荐navicat for mysql),也可以直接进入服务器的命令行模式查看数据库。

安装 Nginx

Nginx 真的是现在必不可少的一个软件。在转发请求、负载均衡等方面非常非常的有用。这里我们先简单的使用nginx的端口转发代理等几个功能。它可以将几个不同的服务集中在一个80端口下,根据域名或者请求路径来区分。

1.注意,在安装nginx之前还需要安装几个nginx的依赖插件。

2.安装pcre yum install -y pcre pcre-devel:

3.安装zlib yum install -y zlib zlib-devel



4.安装openssl,这个推荐安装,毕竟大家都在使用https证书了,yum install -y openssl openssl-devel



5.下载源代码,复制下载地址,并使用wget命令下载到服务器上,下载地址如下:

https://nginx.org/en/download.html[1]

6.解压下载的文件并进入解压好的目录tar -zxvf nginx-1.13.8.tar.gz && cd nginx-1.13.8



7.执行配置命令./configure



8.继续编译安装nginxmake && make install

9.查看安装结果whereis nginx



10.跳转到安装好的nginx目录下,进入sbin目录cd /usr/local/nginx/sbin

11.启动nginx./nginx

?./nginx,启动nginx;

?./nginx -s stop,停止nginx;

?./nginx -s quit,退出nginx;

?./nginx -s reload,重启nginx。

12.安装成功后,使用IP公网地址即可进行访问。

安装Git

centos上是没有安装git,而git是我们开发中经常要使用的工具,这里就讲一下怎么安装git。

1.在服务器上执行yum install git。如果上面的几个软件没有安装,您可能还需要安装几个依赖库,这个可以查看出现的错误来决定安装那些库。



2.确定一下git是否安装完成git --version

总结

至此为止,一个简单的前端环境就已经安装好了,你可以把你的项目通过git扔到服务器上进行访问了,如果你觉得我的文章对你有所帮助,多转发多关注都是对我莫大的鼓励,[

相关推荐

教你一个解决手机卡顿的方法(10秒解决手机卡顿问题)

我们的手机天天刷头条,看视频,用了一阶段时间以后,就时不时的发生卡顿现象。昨天我的手机就发现了这个问题。友友们,你们遇到过这样的问题吗?你们都是怎样解决的?我看了一眼我的粉丝情况,头条君给我分析的很精...

手机视频缓存清理,3步彻底清空,告别卡顿

在我们使用手机观看视频的过程中,经常会产生大量的缓存垃圾,这些垃圾文件不仅占用了手机的存储空间,还可能导致手机卡顿和运行缓慢。然而,你知道如何彻底清空手机的视频缓存,让手机恢复流畅的使用体验吗?在本文...

关手机这个开关,轻松提升流畅度!

关闭手机这个开关,跟新买的一样流畅。手机不要再清理垃圾了,只要关闭这个开关,手机就会和新买的差不多,丝滑流畅不卡顿。其实抖音里就隐藏着一个小开关,每天刷过的视频都会保存在手机里,如果一直不清理,手机就...

如何清理今日头条和西瓜视频的内存,让手机流畅不卡顿?

对于老年人而言,今日头条和西瓜视频能带来丰富的资讯与娱乐。然而,随着使用时间的增加,这些应用会占用大量手机内存,致使手机运行卡顿。那该如何解决呢?接下来,我将用最简单易懂的方式教老年人清理今日头条和西...

视频在线如何转换格式?好用不卡顿的三种转换办法

转换视频格式目前来说已经是很熟练的操作了,但是还有些用户可能还是不知道,小编今天就特意给大家带来一些小众才知道的转换教程,让新手也能快速的上手去转换视频格式,以后获取到视频就不怕内容丢失了,视频的格式...

如何把视频慢放处理?这几个慢放方法记得收藏

如何把视频慢放处理?如果你想让视频慢放,可能是因为你想放慢一些精彩的瞬间,或者你想制作一个慢动作视频。在这篇文章中,我们将介绍一些调速方法,这些方法可以有效地调整视频速度,一起来学习一下吧。方法一:使...

如何清理看过的视频,释放垃圾,让手机更流畅?

现在谁的手机上没几个短视频平台,无聊时就会刷别人的视频。可您知道吗?我们看过的内容都会被自动保存在手机里,而且很耗内存。如果长时间不释放,手机就会出现各种问题,其中最突出的就是反应慢。相信很多老年人的...

手机掉帧是怎么回事?刷视频的时候经常掉帧卡顿

手机掉帧是指在运行应用或视频时,画面出现卡顿、不流畅的现象,通常由硬件性能不足、软件优化不佳、内存占用过高、网络问题或设备过热等因素引起。尤其是在刷视频时,掉帧问题可能更为明显,以下是具体原因及解决方...

拍视频画面卡顿不流畅,原来是相机设置错误 #短视频拍摄

拍摄视频时,应该选择哪种快门速度?许多新手朋友可能会认为,快门速度越高,画面就越清晰,实则不然。因为拍摄视频时,需要考虑一个问题,即动态模糊。例如,如果设置为24帧/秒,那么每秒钟会拍摄24张图片。如...

手机卡顿最大原因#视频太卡怎么变流畅

抖音这几个开关是手机卡顿的最大原因。你是不是也会经常遇到刷视频的时候,打开一个视频之后老半天还在那转着圈圈,总觉得手机没有之前流畅了。这就说明你的手机占用的内存太多了,导致手机卡顿,使用不流畅。使用手...

为啥你家的玩游戏和刷视频经常性的会卡,那是你不懂这些小妙招

本内容来源于@什么值得买APP,观点仅代表作者本人|作者:暴走的黄小猪说到网速有不少的值友都有一个共同点,那就是“卡”,那是你根本没体验过啥叫真正的网速啊,全屋零四条网络报表也花不了几个钱你们的方法...

电脑看视频卡顿有什么解决方法?(电脑看视频画面卡顿是什么原因)

电脑看视频卡顿的原因可能多种多样,包括硬件性能不足、网络问题、软件设置不当等。以下是一些常见的解决方法,帮助你改善视频播放的流畅度:一、硬件方面1.检查硬件性能:如果电脑配置较低,尤其是CPU、内存或...

手机Wi-Fi满格但视频卡顿,你需要这样解决

累了一天的打工人回家拿出手机准备玩玩游戏,看看电影时,发现网络异常卡顿,但手机又显示Wi-Fi信号满格,当咱们遇到此类问题时,这些动作能让网络恢复正常,方法如下。一、重启路由器和光猫很多家庭在安装好路...

视频越刷越卡?原来是路由器开启了这个功能,关闭方法来了

应该很多小伙伴都有过类似的经历,就是在家里长时间刷视频或者看剧的时候,网速好像会越来越慢,视频总是要加载。手机本身可能是一部分原因,但路由器也会影响,你知道吗?当我们在刷视频的,路由器会悄悄地开启大量...

一招解决视频卡顿的问题,改变发布渠道后,结果香了

最近一段时间拍了很多美景视频,编辑发布到头条后,有时一直显示在缓冲,播放不了,有时打开断断续续的,老是卡顿。导致的后果是:要么展现量很低,要么阅读量寥寥无几,这让我非常苦恼。所以再发布作品时,我只好文...

取消回复欢迎 发表评论: