没有不值得去解决的问题,也没有不值得去学习的技术!

在 Windows 10 64 下获取 MDN 学习区的代码示例

打开网址:http://www.learning-area.localhost/ ,在这里你会看到列出的目录的内容
1、参考网址:https://developer.mozilla.org/zh-CN/docs/learn ,如图1
参考网址:https://developer.mozilla.org/zh-CN/docs/learn
图1
2、参考第4步骤,打开电脑中的 命令提示符(Windows),参考网址:https://www.lifewire.com/how-to-open-command-prompt-2618089 ,如图2 Open Command Prompt in Windows 10 Tap or click the Start button, followed by All apps. If you’re not using the Desktop in Windows 10, tap the All apps button on the bottom-left of your screen instead. It’s the icon that looks like the small list of items. Tip: The Power User Menu is a much faster way to get to Command Prompt in Windows 10 but only if you’re using a keyboard or mouse. Just choose Command Prompt from the menu that appears after pressing WIN+X or right-clicking on the Start button. Find the Windows System folder from the list of apps and tap or click it. Under the Windows System folder, click or tap Command Prompt. Command Prompt should open immediately. You can now execute whatever commands in Windows 10 you’d like to run. 在Windows 10中打开命令提示符 点按或点击开始按钮,然后点击所有应用。 如果您在Windows 10中未使用桌面,请点按屏幕左下角的“所有应用”按钮。 这是一个看起来像小项目列表的图标。 提示:高级用户菜单是在Windows 10中访问命令提示符的快捷方式,但前提是您使用的是键盘或鼠标。 只需在按下WIN + X之后出现的菜单中选择Command Prompt,或者右键单击Start按钮。 从应用程序列表中找到Windows系统文件夹,然后点击或单击它。 在Windows系统文件夹下,单击或点击命令提示符。 命令提示符应该立即打开。 您现在可以在Windows 10中执行任何您想要运行的命令。
参考第4步骤,打开电脑中的 命令提示符(Windows),参考网址:https://www.lifewire.com/how-to-open-command-prompt-2618089
图2
3、按下 WIN + X 之后出现的菜单中选择 Command Prompt,或者右键单击Start按钮,如图3
按下 WIN + X 之后出现的菜单中选择 Command Prompt,或者右键单击Start按钮
图3
4、从应用程序列表中找到Windows系统文件夹,然后点击或单击它。在Windows系统文件夹下,单击或点击命令提示符。如图4
从应用程序列表中找到Windows系统文件夹,然后点击或单击它。在Windows系统文件夹下,单击或点击命令提示符
图4
5、从应用程序列表中找到Windows PowerShell文件夹,推荐使用 Windows PowerShell,功能更丰富,如图5
从应用程序列表中找到Windows PowerShell文件夹,推荐使用 Windows PowerShell,功能更丰富
图5
6、复制学习区的repo到命令提示符当前目录下一个叫做learning-area的文件夹里面,利用如下命令,如图6
复制学习区的repo到命令提示符当前目录下一个叫做learning-area的文件夹里面,利用如下命令
图6


git clone https://github.com/mdn/learning-area
cd .\learning-area\
git pull


7、编辑 C:\Windows\System32\drivers\etc\hosts 文件


# MDN learning-area
127.0.0.1 learning-area.localhost www.learning-area.localhost


8、新增 C:\nginx-1.10.1\conf\vhosts\learning-area.conf 文件


## WWW ##
server {
    listen 80; ## 监听 ipv4 上的 80 端口
    # listen [::]:80 default_server ipv6only=on; ## 监听 ipv6 上的 80 端口

    root E:/wwwroot/learning-area;
    index index.html;

    server_name www.learning-area.localhost;

    charset utf-8;
	autoindex on;

	access_log logs/www.learning-area.localhost.access.log;
	error_log logs/www.learning-area.localhost.error.log;

    # location ~* ^.+\.(jpg|jpeg|gif|png|ico|css|pdf|ppt|txt|bmp|rtf|js)$ {
    #    access_log off;
    #    expires max;
    # }

    client_max_body_size 128M;

    # There is a VirtualBox bug related to sendfile that can lead to
    # corrupted files, if not turned-off
    # sendfile off;

	location ~ /\.(ht|svn|git) {
        deny all;
    }
}


## MISC ##

### WWW Redirect ###
server {
    listen 80; ## 监听 ipv4 上的 80 端口
    # listen [::]:80 default_server ipv6only=on; ## 监听 ipv6 上的 80 端口
    server_name  learning-area.localhost;
    return       301 http://www.learning-area.localhost$request_uri;
}



9、重新加载 Nginx,执行命令,如图7
重新加载 Nginx,执行命令
图7


.\nginx -s reload


10、打开网址:http://www.learning-area.localhost/ ,在这里你会看到列出的目录的内容,如图8
打开网址:http://www.learning-area.localhost/ ,在这里你会看到列出的目录的内容
图8

需要长期技术维护或远程问题排查?

我是拥有 15+ 年经验的 PHP / Go 后端工程师,长期关注已有系统维护、Bug 修复、性能优化、服务器排查、WordPress 网站维护和小功能迭代。

如果你的项目遇到以下情况,可以先从一次小问题排查开始合作:

  • ✅ PHP / Laravel / Yii2 老项目无人维护
  • ✅ Go / Gin 后端接口需要排查或优化
  • ✅ WordPress 网站访问慢、报错或插件冲突
  • ✅ Nginx / MySQL / Redis / Linux 服务器异常
  • ✅ CDN / Cloudflare / DNS / HTTPS 配置问题
  • ✅ 需要长期远程技术支持或兼职维护

更多介绍请查看:关于我 & 合作

微信:13980074657
邮箱:shuijingwanwq@gmail.com
Telegram:@shuijingwan
GitHub:https://github.com/shuijingwan

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理