๐GitHub์์ ์น ๊ฐ๋ฐ์๋ฅผ ์ํ 10๊ฐ์ง ํธ๋ ๋ ํ๋ก์ ํธ - 2021๋ 4์ 30์ผ
1.WinBox
WinBox๋ ์ ๋ฌธ์ ์ธ HTML5 ๋คํธ์ํฌ ์ฐฝ ๊ด๋ฆฌ์์ ๋๋ค: ๊ฒฝ๋๊ธ, ํ์ํ ์ฑ๋ฅ, ์์กด์ฑ ์์, ์์ ๋ง์ถคํ, ์์ค ์คํ!
๋ค์ ๋จ๊ณ / winbox
WinBox๋ ์ ๋ฌธ์ ์ธ HTML5 ๋คํธ์ํฌ ์ฐฝ ๊ด๋ฆฌ์์ ๋๋ค: ๊ฒฝ๋๊ธ, ํ์ํ ์ฑ๋ฅ, ์์กด์ฑ ์์, ์์ ๋ง์ถคํ, ์์ค ์คํ!
ํ๋ ๋คํธ์ํฌ ์ฐฝ ๊ด๋ฆฌ์: ๊ฒฝ๋๊ธ, ํ์ํ ์ฑ๋ฅ, ์์กด์ฑ ์์, ์์ ๋ง์ถคํ ์คํ!
Demo โโขโ Getting Started โโขโ Options โโขโ API โโขโ Themes โโขโ Customize โโขโ Changelog
ํ์ฅ ๋ฐ๋ชจ/์ฝ๋ ์:https://nextapps-de.github.io/winbox/
๊ฐ์ํ๋ค
์ต์ ์์ ์ ์ธ ๋ฒ์ ๊ฐ์ ธ์ค๊ธฐ(๊ถ์ฅ):
๋ฌถ์: (๋ชจ๋ ์์ฐ์ ํ ํ์ผ์ ๋ฌถ์: js+css+html+ ์์ด์ฝ)
winbox.๋ฌถ์js
Download
https://rawcdn.githack.com/nextapps-de/winbox/0.2.0/dist/winbox.bundle.js
๋น ๋ฌถ์: (js์ css๋ ๋ถ๋ฆฌ๋์ด ์์ผ๋ฉฐ css๋base64 ์์ด์ฝ์ ํฌํจํฉ๋๋ค)
winbox.min.js
Download
https://rawcdn.githack.com/nextapps-de/winbox/0.2.0/dist/js/winbox.min.js
winbox.min.css
Download
https://rawcdn.githack.com/nextapps-de/winbox/0.2.0/dist/css/winbox.min.css
์ถ์ฒ: (์ ํ ๋ฌถ์ง ์๊ณ ๊ทธ๋ฆผ์ด ์์ ์์์ธ URL)
ES6 ๋ชจ๋
Download
์ด Github ์ ์ฅ์์/src/js ํด๋
ํ์ผ ์ ๊ฐ์(์์ค)
Download
์ด Github ์ ์ฅ์์/src/css ํด๋
winbox.css(์ปดํ์ผ๋จ)
Download
https://rawcdn.githack.com/nextapps-de/winbox/0.2.0/src/css/winbox.css
src.์งํผ
Download
๊ทธ๋ฆผ์ ์๋ณธ ์์์ ํฌํจํ ๋ชจ๋ ์๋ณธ ํ์ผ์ ๋ค์ด๋ก๋ํฉ๋๋ค.
์ต์ ์ ๋ณด๋ฅผ ๋ณด๋ ค๋ฉด(NPM):npm install winbox
Get Latest Nightly (Do not use for production!):
Just exchange the version number from the URLs above with "master", e.g.: "/winbox/โฆ
2. ์คํฌ๋ฆฝํธ ํคํธ
Automation for Developers, Automate Anything! Making scripts easy to run, write, and share
3. ๋ฐ๋๋ผ ์์ผ์ค
Zero-runtime Stylesheets-in-TypeScript. Write your styles in TypeScript (or JavaScript) with locally scoped class names and CSS Variables, then generate static CSS files at build time.
oss ๊ฒ์ / ๋ฐ๋๋ผ ์์ผ์ค
TypeScript์ ๋ฐํ์ ์คํ์ผ์ํธ๊ฐ ์์ต๋๋ค.
๐ง ๋ฐ๋๋ผ ์์ผ์ค
Zero-runtime Stylesheets-in-TypeScript.
Write your styles in TypeScript (or JavaScript) with locally scoped class names and CSS Variables, then generate static CSS files at build time.
Basically, itโs โCSS Modules-in-TypeScriptโ but with scoped CSS Variables + heaps more.
@keyframes
and @font-face
rules.
calc
expressions.
Write your styles in .css.ts
files.
// styles.css.ts
import { createTheme,
โฆ
4.๋ฐ๋
The headless editor framework for web artisans.
์ ๋ฒ ๋ฅดํ ์์ค / ๋ฐ๋
๋คํธ์ํฌ ์ฅ์ธ์ ์ํ ํค๋ ํธ์ง๊ธฐ ํ๋ ์์ํฌ
tiptap 2
A headless, framework-agnostic and extendable rich text editor, based on ProseMirror.
If youโre looking for tiptap 1, click here.
์.
Have a look at the examples to see tiptap in action.
๋ฌธ์
The full documentation is a available on www.tiptap.dev.
์ปค๋ฎค๋ํฐ
For help, discussion about best practices, or any other conversation that would benefit from being searchable:
๐ ์คํฐ์
-
รผberdosis
๐ - Ziff Media Group
- Incyte Studios
- dotCMS
- Restruct
- Bitcrowd
- Reflect
-
Rimsys
๐ -
Complish
๐ -
CosmicMind
๐
mymind DocIQ Apostrophe CMS Ycode, Flow Mobile, Gretel, Omics Data Automation, Novadiscovery, Atlan Technologies, Gamma, Kirchner Consulting, IT Xpert and hundreds of awesome inviduals.
Using tiptap in production? Invest in the future of tiptap and become a sponsor!
์ด๋ฐ์ง
Please see CONTRIBUTING for details.
๊ณตํ์
์ ํ
DOMPurify - a DOM-only, super-fast, uber-tolerant XSS sanitizer for HTML, MathML and SVG.
์น์ ํ๋ค / Domprify
HTML, MathML, SVG์ ์ ์ฉ๋๋ DOM, ์ด๊ณ ์, uber์ ๋ํ ๊ด์ฉ์ ๊ฐ์ถ XSS ์ ํ์ DOMPurify๋ ๋ณด์ ๊ธฐ๋ณธ๊ฐ์ ์ฌ์ฉํ์ง๋ง, ์ค์ ๊ฐ๋ฅ์ฑ๊ณผ ์ฐ๊ฒฐ์ ๋ง์ด ์ ๊ณตํฉ๋๋ค.๋ฐ๋ชจ:
Domprify
DOMPurify is a DOM-only, super-fast, uber-tolerant XSS sanitizer for HTML, MathML and SVG.
It's also very simple to use and get started with. DOMPurify was started in February 2014 and, meanwhile, has reached version 2.3.1.
DOMPurify is written in JavaScript and works in all modern browsers (Safari (10+), Opera (15+), Internet Explorer (10+), Edge, Firefox and Chrome - as well as almost anything else using Blink or WebKit). It doesn't break on MSIE6 or other legacy browsers. It either uses a fall-back or simply does nothing.
Our automated tests cover 17 different browsers right now, more to come. We also cover Node.js v14.15.1, v15.4.0, running DOMPurify on jsdom. Older Node.js versions are known to work as well.
DOMPurify is written by security people who have vast background in web attacks and XSS. Fear not. For more details please also read about our Security Goals & Threat Modelโฆ
6.๋ฌดํ๊ณผ
Fig adds VSCode style autocomplete to your terminal
๋ฌดํ๊ณผ / ์๋ ์์ฑ
Fig๊ฐ ํฐ๋ฏธ๋์ ์๋์ผ๋ก ์ถ๊ฐ๋ฉ๋๋ค.
Fig adds autocomplete to your terminal.
As you type, Fig pops up subcommands, options, and contextually relevant arguments in your existing terminal on macOS.
๐ CLI ๋๊ตฌ์ ๋ํ ์๋ฃ ์ฌ์ ์ถ๊ฐ
Want to add autocomplete to a CLI tool (or make changes to an existing autocomplete spec)? We welcome contributions!
Completion specs are defined in a declarative schema that specifies subcommands
, options
and arguments
. Suggestions are generated from information in the spec or can be generated dynamically by running shell commands or reading local files.
For documentation and tutorials, visit fig.io/docs
To request autocomplete for a CLI tool, open an issue.
๐ ์์ํ๋ค
Build your first spec in 3 min or less: fig.io/docs/getting-started
Prerequisites:
- Early access to the Fig macOS app.
If you don't have access yet, sign up for the waitlist and say you're interested in building completions!
- Node and NPMโฆ
7. ๋ณ๋์ ์ธํ ๋ฐฐ์ฐ
Teach puppeteer new tricks through plugins.
๋ํญํ๋ค / ์ํผ ์ธํ ๋ฐฐ์ฐ
๐ฏ ํ๋ฌ๊ทธ์ธ์ ํตํด ์ธํ ๋ฐฐ์ฐ์๊ฒ ์๋ก์ด ์๋ฒ์ ๊ฐ๋ฅด์น๋ค.
์ํผ ์ธํ ๋ฐฐ์ฐ
This is the monorepo for puppeteer-extra
, a modular plugin framework for puppeteer
. :-)
puppeteer-extra
package.
In case you're interested in the available plugins, check out the packages folder.
Monorepo
Contributing
์ด๋ฐ์ง
PRs and new plugins are welcome! The plugin API for puppeteer-extra
is clean and fun to use. Have a look the PuppeteerExtraPlugin
base class documentation to get going and check out the existing plugins (minimal example is the anonymize-ua plugin) for reference.
We use a monorepo powered by Lerna (and yarn workspaces), ava for testing, the standard style for linting and JSDoc heavily to auto-generate markdown documentation based on code. :-)
Lerna
๋ ๋ฅด๋
This monorepo is powered by Lerna and yarn workspaces.
์ด๊ธฐ ์ค์
# Install deps
yarn
# Bootstrap the packages in the current Lerna repo.
# Installs all of their dependencies and links
โฆ
8.swc
swc is a super-fast compiler written in rust; producing widely-supported javascript from modern standards and typescript.
swc ํ๋ก์ ํธ / swc
swc๋rust๋ก ์์ฑ๋ ์ด๊ณ ์ ์ปดํ์ผ๋ฌ์ ๋๋ค.ํ๋ ํ์ค๊ณผ typescript์์ ๊ด๋ฒ์ํ๊ฒ ์ง์๋๋javascript๋ฅผ ์์ฑํฉ๋๋ค.
Make the web (development) faster
swc is a super-fast typescript / javascript compiler written in rust. It's a library for rust and javascript at the same time. If you are using swc from rust, see rustdoc and for most users, your entrypoint for using library will be parser.
If you are using swc from javascript, please refer to docs on the website.
๋ฌธ์
Check out the documentation in the website.
ํน์ง.
Please see comparison with babel.
ํํ
Please see benchmark results on the website.
swc ์ง์
swc is a community-driven project, and is maintained by a group of volunteers. If you'd like to help support the future of the project, please consider:
- Giving developer time on the project. (Message us on Github discussions (preferred) or Slack for guidance!)
- Giving funds by becoming a sponsor (see https://opencollective.com/swc)!
์ด๋ฐ์ง
See CONTRIBUTING.md. You may also findโฆ
9. ๋จน๋ฌผ ์๊ตญ
Inkline is the customizable Vue.js UI/UX Library designed for creating flawless responsive websites.
๋จน์ค / ๋จน์ค
Inkline์ ๋ง์ถคํ Vue์ ๋๋ค.js UI/UX ๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ ์๋ฒฝํ ์๋ต์ ์ํ ์น ์ฌ์ดํธ๋ฅผ ๋ง๋ค๊ธฐ ์ํด ์ค๊ณ๋์์ต๋๋ค.
๋จน์ค
Inkline is the customizable Vue.js UI/UX Library designed for creating flawless responsive websites. Inkline is written and maintained by
Homepage
ยท
Documentation
ยท
Issue Tracker
์นดํ๋ก๊ทธ
- Installation
- Join the beta
- Bugs and feature requests
- Contributing
- Community
- Releases
- Versioning
- Creators
- Copyright and license
์ฅ์น
Read the Getting Started page and find information on framework contents, templates, examples, and more.
ํ ์คํธ ๋ฒ์ ์ถ๊ฐ
The beta version for Inkline 3 (compatible with Vue 3) is finally out! Here are some basic installation instructions. Keep in mind that the beta is still subject to change.
npm install @inkline/inkline@next
'@inkline/inkline/src/inkline' ์ ๊ฐ์ ธ์ต๋๋ค.scssโ;@Inkline/Inkline์์ ์ํฌ ๋ผ์ธ ๊ฐ์ ธ์ค๊ธฐ
vue์์ ๊ฐ์ ธ์ค๊ธฐ {createApp}
''์์ ์์ฉ ํ๋ก๊ทธ๋จ ๊ฐ์ ธ์ค๊ธฐ/์์ฉ ํ๋ก๊ทธ๋จ.vue'
const app=createApp(app);
์์ฉ ํ๋ก๊ทธ๋จ.์ํฌ ์ฌ์ฉํ๊ธฐ;
์์ฉ ํ๋ก๊ทธ๋จ.๋ง์ดํธ("#app");
์ค๋ฅ ๋ฐ ๊ธฐ๋ฅ ์์ฒญ
์ค๋ฅ๋ ๊ธฐ๋ฅ ์์ฒญ์ด ์์ต๋๋ค...
View on GitHub
10. ๋ง์์ง
์ฐ์ํ๊ณ ๋ง์์ ํฌ๊ดํ๋ ๋ ธ๋.TypeScript ๊ธฐ๋ฐ Js ์น ํ๋ ์์ํฌ
ํฌ์์ธ / ๋ง์์ง
์ธ๋ จ๋๊ณ ๊ธฐ๋ฅ์ ์ธ ๋ ธ๋.TypeScript ๊ธฐ๋ฐ Js ์น ํ๋ ์์ํฌ๐.
https://foalts.org
๋ฌด์์ด ๋ง์์ง์ ๋๊น?
๋ง์์ง๋ ํ๋์ ๋ ธ๋๋ค.์น ์์ฉ ํ๋ก๊ทธ๋จ์ ๋ง๋๋ ๋ฐ ์ฌ์ฉ๋๋ JS ํ๋ ์์ํฌ์ ๋๋ค.
๊ทธ๊ฒ์ ์ด๋ฏธ ๋ง๋ค์ด์ง ์กฐ๋ฆฝํ์ ์ ๊ณตํ๊ธฐ ๋๋ฌธ์ ๋๋ ๋งค๋ฒ ๋ฐํด๋ฅผ ์ฌ๋ฐ๋ช ํ ํ์๊ฐ ์๋ค.์น ์์ฉ ํ๋ก๊ทธ๋จ์ ๊ตฌ์ถํ ์ ์๋ ์์ ํ ํ๊ฒฝ์ ์ ๊ณตํฉ๋๋ค.์ฌ๊ธฐ์๋ CLI, ํ ์คํธ ๋๊ตฌ, ํ๋ฐํธ์๋ ์ ํธ๋ฆฌํฐ, ์คํฌ๋ฆฝํธ, ๊ณ ๊ธ ์ธ์ฆ, ORM, ๋ฐฐํฌ ํ๊ฒฝ, GraphQL ๋ฐ Swagger API, AWS ์ ํธ๋ฆฌํฐ ๋ฑ์ด ํฌํจ๋ฉ๋๋ค.npm ๊ฒ์ ํจํค์ง๋ฅผ ํจ๊ป ์์ ํ ๋ ๋ฐฉํฅ์ ์์ ํ์๊ฐ ์์ต๋๋ค.๋ชจ๋ ๊ฒ์ด ๋ค ์ค๋น๋์๋ค.
์ด ๋ชจ๋ ๊ธฐ๋ฅ์ ์ ๊ณตํ์ง๋ง ํ๋ ์์ํฌ๋ ์ฌ์ ํ ๊ฐ๋จํ๋ค.๋ณต์ก์ฑ๊ณผ ๋ถํ์ํ ์ถ์์ ํ์ชฝ์ ๋์ ๊ฐ์ฅ ์ง๊ด์ ์ด๊ณ ํํ๋ ฅ ์๋ ๋ฌธ๋ฒ์ ์ ๊ณตํ๋ค.์ฐ๋ฆฌ๋ ๊ฐ๊ฒฐํ๊ณ ์ฐ์ํ ์ฝ๋๊ฐ ๋ฏธ๋์ ์์ฉ ํ๋ก๊ทธ๋จ์ ๊ฐ๋ฐํ๊ณ ์ ์งํ๋ ๊ฐ์ฅ ์ข์ ๋ฐฉ๋ฒ์ด๋ผ๊ณ ๋ฏฟ๋๋ค.์ธ์ฝ๋ฉํ๋ ๋ฐ ๋ ๋ง์ ์๊ฐ์ ๋ค์ผ ์ ์์ ๋ฟ๋ง ์๋๋ผ, ์ด๋ป๊ฒ ํ๋์ง ์์๋ณด๋ ค๋ ์๋๋ ํ ์ ์๋ค.
View on GitHub
๋ณํ๋์ ์์ํ๋ค๐
์ง๋ 7์ผ ๋์ ์์นํญ์ด ๊ฐ์ฅ ์ปธ๋ค
Free Programming Books+2453๊ฐ์ ๋ณ
Build Your Own X+2383๊ฐ์ ๋ณ
Web Developer Roadmap+2178๊ฐ ๋ณ
Public APIs+1804๊ฐ ๋ณ
JavaScript Algorithms+1341๊ฐ ๋ณ
์ง๋ 7์ผ๊ฐ ์ต๊ณ ์ฆ๊ฐ์จ(%)
JS Image Carver +37%
party.js +26%
Choc UI +24%
Superplate +22%
Fig +8%
์ง๋ 30์ผ ๋์
Coding Interview University+7913๊ฐ ๋ณ
Free Programming Books+4655๊ฐ์ ๋ณ
Web Developer Roadmap+4498๊ฐ ๋ณ
Public APIs+4497๊ฐ์ ๋ณ
Clone Wars+3905๊ฐ ๋ณ
์ง๋ 30์ผ ๋์ ์ต๊ณ ์ฆ๊ฐ์จ(%)
Appsmith +105%
React Flow +84%
Simpler State +59%
Clone Wars +59%
Headless UI +55%
๋ง์ฝ ๋น์ ์ด ์ด ๊ธ์ ์ข์ํ๋ค๋ฉด ํธ์ํฐ์ HTML, CSS, ์๋ฐ์คํฌ๋ฆฝํธ์ ๊ด๋ จ๋ ํ์ ์์ฃผ ์ฌ๋ฆด ์ ์์ต๋๋ค.
Reference
์ด ๋ฌธ์ ์ ๊ดํ์ฌ(๐GitHub์์ ์น ๊ฐ๋ฐ์๋ฅผ ์ํ 10๊ฐ์ง ํธ๋ ๋ ํ๋ก์ ํธ - 2021๋ 4์ 30์ผ), ์ฐ๋ฆฌ๋ ์ด๊ณณ์์ ๋ ๋ง์ ์๋ฃ๋ฅผ ๋ฐ๊ฒฌํ๊ณ ๋งํฌ๋ฅผ ํด๋ฆญํ์ฌ ๋ณด์๋ค https://dev.to/iainfreestone/10-trending-projects-on-github-for-web-developers-30th-april-2021-efnํ ์คํธ๋ฅผ ์์ ๋กญ๊ฒ ๊ณต์ ํ๊ฑฐ๋ ๋ณต์ฌํ ์ ์์ต๋๋ค.ํ์ง๋ง ์ด ๋ฌธ์์ URL์ ์ฐธ์กฐ URL๋ก ๋จ๊ฒจ ๋์ญ์์ค.
์ฐ์ํ ๊ฐ๋ฐ์ ์ฝํ ์ธ ๋ฐ๊ฒฌ์ ์ ๋ (Collection and Share based on the CC Protocol.)
์ข์ ์นํ์ด์ง ์ฆ๊ฒจ์ฐพ๊ธฐ
๊ฐ๋ฐ์ ์ฐ์ ์ฌ์ดํธ ์์ง
๊ฐ๋ฐ์๊ฐ ์์์ผ ํ ํ์ ์ฌ์ดํธ 100์ ์ถ์ฒ ์ฐ๋ฆฌ๋ ๋น์ ์ ์ํด 100๊ฐ์ ์์ฃผ ์ฌ์ฉํ๋ ๊ฐ๋ฐ์ ํ์ต ์ฌ์ดํธ๋ฅผ ์ ๋ฆฌํ์ต๋๋ค