【简介】

  微软官方前不久发布了 try.dot.net 这个有趣的网址,开始只是图个新鲜看了一下,后面通过自身实践过后,发现这着实算是个“有趣”的站点!

  首先我们大概地列举一下这个站点能给我们带来什么?

  1. 在线做一些教学教程,附上可以调试的代码片段,很方便他人学习
  2. 面试的时候更方便了,面试官写好一个代码片段,可以让不同的求职者直接在上面编写代码运行程序

  当然不止上述的功能,利用你的想象力去丰富工具的使用场景吧。

  接下来我们通过一个自身的使用经历介绍一下如何使用这个有趣的工具。

【实现过程】

  1.登陆 try.dot.net 的官方介绍网站,了解如何使用 try.dot.net

  我们通过微软提供的github项目地址和微软发布说明可以轻松的了解到try.dot.net的使用说明。这里提供链接:

  GitHub地址:https://github.com/dotnet/try

  官方介绍地址:https://dotnet.microsoft.com/platform/try-dotnet

  从介绍网址看到经典用法:

 

  通过iframe嵌套到自己的网址展示代码片段,遗憾的是,目前本人还卡在iframe跨域拒绝的阶段 /手动哭(搞了一晚上还是没搞明白怎么解决iframe跨域这个网址,有大神了解可以留言并给个demo瞅瞅)

  通过上面的iframe地址可以看到try.dot.net 展示代码片段的时候是通过gist这个代码片段id进行链路的。

  2.gist的使用

  gist是github的一个附加功能,支持将多个代码片段存放在站点上,站点会针对代码片段自动生成一个id,在别的地方就可以使用id引用了。

  首先需要登录gist的站点:https://gist.github.com

  可能有人可以访问github,却访问不了这个网站(比如我),这里有个解决方案:

  配置hosts(不会自行百度吧):192.30.253.118 gist.github.com

  然后就可以登陆到这个站点了。

  

  界面非常简洁,直接输入文件名和相关代码点右下角的保存即可。AddFile可以添加另一段代码。

  随便写了个实体类放在这里:

  

  保存后,点击刚才的类文件,便可以看到浏览器的url变成了这样的:

  https://gist.github.com/sevenTiny/98b8b484dd9d0fbf8bd1bac0425db914

  已经生成了代码片段的id。

  接下来我们就要复制这个id去用try.dot.net调试我们的代码片段了。

  3.try.dot.net的集成

  在上文中复制id,然后将try.dot.net demo中的fromGist进行替换即可得到自己的代码片段地址

  https://try.dot.net/?fromGist=98b8b484dd9d0fbf8bd1bac0425db914

  我们可以访问一下

  

  代码运行正常,结果也正确!

  那么问题来了,有人说我的也是这么操作的,为啥访问地址后,代码没出现呢?代码区域是空白的...

  我开始也遇到了这个情况,对照了和微软官方的代码段后,发现只有缺少Main方法这个区别,无奈又加了个带Main方法的程序片段,然后问题解决了,代码成功出现!

  猜测微软这个try.dot.net是模仿了个控制台应用程序,必须要有控制台应用程序的Main方法才能运行。

  必须提供带Main方法的代码片段

  

  运行后的try.dot.net界面只能显示该代码片段,其他代码片段不会显示,但是可以引用使用。

【拓展】

  通过上述操作,我们已经了解到了如何将自己的代码片段使用 try.dot.net 展示并运行,那么我们可以小小激发我们一下好奇心,了解一下微软怎么在前端界面做的代码提示呢?

  我们打开浏览器F12查看请求信息,然后输入一段代码

  

  

  可以清晰地看出,每次输入字符,站点都会请求分析当前的代码,然后返回可能提示出的代码片段,弹出代码提示框。

  原理还是比较直观的。

  谢谢看到这里~

try.dot.net 的正确使用姿势的更多相关文章

  1. ASP.NET Core 2.2 : 十六.扒一扒新的Endpoint路由方案 try.dot.net 的正确使用姿势 .Net NPOI 根据excel模板导出excel、直接生成excel .Net NPOI 上传excel文件、提交后台获取excel里的数据

    ASP.NET Core 2.2 : 十六.扒一扒新的Endpoint路由方案   ASP.NET Core 从2.2版本开始,采用了一个新的名为Endpoint的路由方案,与原来的方案在使用上差别不 ...

  2. xpath轴的正确使用姿势

    网上看了许多关于轴的介绍,只介绍了语法,而没有明说具体实际中该怎么使用,百思不得其解. 背景--python中使用xpath:  ----------------------------------- ...

  3. 高版本jquery尤其是1.10.2的版本设置input radio设置值的最正确的姿势。

    $("input:radio[name="analyshowtype"]").attr("checked",false); $(" ...

  4. NSnotificationCenter 正确使用姿势, removeObject 探索

    最近在做平板的过程中,发现了一些很不规范的代码.偶然修复支付bug的时候,看到其他项目代码,使用通知的地方没有移除,我以为我这个模块的支付闪退是因为他通知没有移除的缘故.而在debug和看了具体的代码 ...

  5. 微信H5中静默登录及非静默登录的正确使用姿势

    在微信中打开网页且需要调用微信登录接口时,微信官方给我们提供了两种登录调用方式:静默登录和非静默登录:但是官方文档中却没有说明在何种情况下使用静默登录,何种情况下使用非静默登录,所以在这里,我想将之前 ...

  6. Java日志正确使用姿势

    前言 关于日志,在大家的印象中都是比较简单的,只须引入了相关依赖包,剩下的事情就是在项目中“尽情”的打印我们需要的信息了.但是往往越简单的东西越容易让我们忽视,从而导致一些不该有的bug发生,作为一名 ...

  7. MongoDB系列:五、MongoDB Driver使用正确的姿势连接复制集

    MongoDB复制集(Replica Set)通过存储多份数据副本来保证数据的高可靠,通过自动的主备切换机制来保证服务的高可用.但需要注意的时,连接副本集的姿势如果不对,服务高可用将不复存在. 使用复 ...

  8. 基于winserver的Apollo配置中心分布式&集群部署实践(正确部署姿势)

    基于winserver的Apollo配置中心分布式&集群部署实践(正确部署姿势)   前言 前几天对Apollo配置中心的demo进行一个部署试用,现公司已决定使用,这两天进行分布式部署的时候 ...

  9. 玩转java多线程(wait和notifyAll的正确使用姿势)

    转载请标明博客的地址 本人博客和github账号,如果对你有帮助请在本人github项目AioSocket上点个star,激励作者对社区贡献 个人博客:https://www.cnblogs.com/ ...

随机推荐

  1. Nacos系列:基于Nacos的注册中心

    前言 所谓注册中心,其实是分布式架构演进过程中的产物,在系统中充当一个协调者的角色.但是,为什么需要这样一个协调者的角色呢?我们先来看一个例子,以便理解为什么分布式架构中需要有注册中心. 案例 小明和 ...

  2. Android ios嵌套web页面

    我们现在做一个活动页面,Android和ios的活动页面用web来做,方便更改,下面有几个小问题: 1.在Android和ios中,虽然web上面可以存localstorage,但是到了Android ...

  3. sql server 2008R2 导出insert 语句(转载)

    转载来源: https://blog.csdn.net/zengcong2013/article/details/78648988. sql server 2008R2数据库导出表里所有数据成inse ...

  4. ueditor笔记

    一.ueditor是什么 UEditor 是由百度「FEX前端研发团队」开发的所见即所得富文本web编辑器,具有轻量,可定制,注重用户体验等特点,开源基于MIT协议,允许自由使用和修改代码. 二.ue ...

  5. Sql Server 2008日志满的解决办法

    通过sql命令 USE ZGZY; GO --由完整模式设置为简单恢复模式 ALTER DATABASE ZGZY SET RECOVERY SIMPLE WITH NO_WAIT GO --收缩日志 ...

  6. 通过多线程处理提高Redis性能

    Redis通常被称为单进程单线程模型. 这不是真的! Redis还运行多个后端线程来执行后端清理工作,例如清理脏数据和关闭文件描述符.在Redis中,主线程负责主要任务,包括但不限于:接收来自客户端的 ...

  7. Dynamics 365创建用户提示:您正在尝试使用已由其他用户使用的域登录来创建用户。如何解决。

    摘要: 本人微信公众号:微软动态CRM专家罗勇 ,回复287或者20181128可方便获取本文,同时可以在第一间得到我发布的最新博文信息,follow me!我的网站是 www.luoyong.me ...

  8. 华为有AI,这场转型战有点大

    华为有AI,这场转型战有点大 https://mp.weixin.qq.com/s/qnUP5cgbNxXcAT82NQARtA 李根 发自 凹非寺 量子位 报道 | 公众号 QbitAI 华为有AI ...

  9. Vue组件的is具体用法

    1.为什么要使用is 在vue的官网组件部分中,有明确的描述:当使用 DOM 作为模板时 (例如,使用 el 选项来把 Vue 实例挂载到一个已有内容的元素上),你会受到 HTML 本身的一些限制,因 ...

  10. javascript弹出模态窗体

    function openwindow(url,name,iWidth,iHeight){ //获得窗口的垂直位置 var iTop = (window.screen.availHeight-30-i ...