营销工具社交媒体和影响力营销

CodePen:构建,测试,共享和发现HTML,CSS和JavaScript

内容管理系统面临的一项挑战是测试和生成脚本化工具。 虽然这对大多数出版商来说并不是一个要求,但作为一家技术出版物,我确实喜欢偶尔分享工作脚本来帮助其他人。 我分享了如何使用 JavaScript 检查密码强度、如何使用正则表达式 (Regex) 检查电子邮件地址语法,最近还添加了此计算器来预测在线评论的销售影响。 我希望在网站上添加几十个工具,但 WordPress 不利于这样的发布……它是一个内容系统,而不是一个开发系统。

因此,为了让我的小脚本正常工作,我喜欢使用 CodePen。 CodePen 是一个组织整齐的工具,带有 HTML 面板、CSS 面板、JavaScript 面板、控制台和结果代码的出版物。 当您将鼠标悬停在元素上时,每个面板都会显示信息,以便您了解可能发生的情况,以及 HTML、CSS 和 JS 的颜色编码,以帮助您更轻松地编辑和编写。

CodePen是一个社会发展环境。 从本质上讲,它允许您在浏览器中编写代码,并在构建时查看其结果。 一个有用且自由的在线代码编辑器,适合任何技能的开发人员,尤其是增强了学习代码的人员的能力。 CodePen主要专注于前端语言,例如HTML,CSS,JavaScript和可转化为这些内容的预处理语法。

关于CodePen

有了 CodePen,我可以完成所有必要的工作 发布计算器 我嵌入到网站中。 CodePen 上的大多数创作都是公开且开源的。 它们是其他人和社区可以与之互动的生物,从一颗简单的心,到发表评论,再到根据自己的需求进行分叉和改变。

CodePen-预测在线评论对销售的影响的计算器

使用CodePen,如果您希望在工作时将窗格放在左侧,右侧或底部,则可以更改视图…或在新选项卡中查看HTML。 并排视图可以很好地测试您的响应式设置,因为您可以调整可见窗格的大小。

您可以将工作脚本组织到笔中,将它们组合到项目(多文件编辑器)中,甚至构建集合。 这是一个前端代码的工作组合网站,您可以在其中关注其他作者,将其他公开共享的项目分叉到您自己的项目中进行修改,甚至学习如何通过挑战来做一些有趣的事情。

您可以将其另存为 GitHub Gist,然后将其导出到 拉链 文件,甚至 像这样的文章中的笔:

见笔 在线评论的预测销售影响 by Douglas Karr (@martech_zone) 在 CodePen.

笔编辑器的局限性之一是代码量巨大。 您可能永远不会遇到这个问题,因为编辑器应该可以处理数百或数千行代码。 但是当他们开始达到 5,000 – 10,000 行或更多行代码时,您会看到编辑器开始失败。 但是,您可以添加对其他地方托管的样式表或 JavaScript 的外部引用!

我鼓励你报名。 您将订阅他们的每周电子邮件,并可以将提要添加到您的 RSS 提要中以查看新发布的笔。 而且,如果您开始搜索或浏览那里的公共笔,您会发现一些令人难以置信的项目......用户非常有才华!

关注 Douglas Karr 在Codepen上

付费版本 CodePen Pro 提供了大量用于改进功能或团队的附加功能,包括协作、流程、资产托管、私有视图,甚至使用您的域或子域部署的项目。 当然,CodePen 提供了一个与 Github 集成的优秀存储库,您的整个团队都可以在其中工作。 如果您想像我一样测试一些简单的代码,CodePen 是一个非常宝贵的工具。

Douglas Karr

Douglas Karr 首席营销官是 开放洞察 和创始人 Martech Zone。 道格拉斯帮助了数十家成功的 MarTech 初创公司,协助进行了超过 5 亿美元的 MarTech 收购和投资尽职调查,并继续协助公司实施和自动化其销售和营销策略。 道格拉斯是国际公认的数字化转型和 MarTech 专家和演讲者。 道格拉斯还是一本傻瓜指南和一本商业领导力书籍的出版作者。
返回顶部按钮
关闭

检测到Adblock

Martech Zone 我们能够免费为您提供这些内容,因为我们通过广告收入、联属链接和赞助从我们的网站中获利。 如果您在浏览我们的网站时删除广告拦截器,我们将不胜感激。