mirror of
https://github.com/krahets/hello-algo.git
synced 2026-11-05 23:18:41 +08:00
build
This commit is contained in:
krahets
BIN
docs/assets/hero/astronaut.webp
Normal file
BIN
docs/assets/hero/astronaut.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 274 KiB |
BIN
docs/assets/hero/ground.webp
Normal file
BIN
docs/assets/hero/ground.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 276 KiB |
847
docs/index.html
847
docs/index.html
@@ -1,337 +1,522 @@
|
||||
<!-- Section: hero -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div" style="height: min(100vh, 120vw); position: relative; margin-top:-2.4rem; padding: 0; overflow: hidden;">
|
||||
<!-- hero image -->
|
||||
<!-- <img alt="" class="hero-bg" src="assets/hero/universe_bg.png" /> -->
|
||||
<div class="starfield">
|
||||
<div class="starfield-origin"></div>
|
||||
</div>
|
||||
<div class="hero-div">
|
||||
<img src="assets/hero/ground.png" alt="" style="position: absolute; width: auto; height: 26.445%; left: 28.211%; top: 54.145%;">
|
||||
<img src="assets/hero/links.png" alt="" style="position: absolute; width: auto; height: 78.751%; left: 10.545%; top: 7.326%;">
|
||||
<a href="chapter_introduction/">
|
||||
<img src="assets/hero/astronaut.png" alt="" style="height: 46.673%; left: 35.413%; top: 24.343%;">
|
||||
<span style="left: 52.244%; top: 20.919%;">初识算法</span>
|
||||
</a>
|
||||
<a href="chapter_computational_complexity/">
|
||||
<img src="assets/hero/chapter_computational_complexity.png" alt="" style="height: 12.347%; left: 36.267%; top: 37.653%;">
|
||||
<span style="left: 39.244%; top: 33.919%;">复杂度</span>
|
||||
</a>
|
||||
<a href="chapter_array_and_linkedlist/">
|
||||
<img src="assets/hero/chapter_array_and_linkedlist.png" alt="" style="height: 22.242%; left: 73.242%; top: 52.481%;">
|
||||
<span style="left: 90.897%; top: 76.259%;">数组与链表</span>
|
||||
</a>
|
||||
<a href="chapter_stack_and_queue/">
|
||||
<img src="assets/hero/chapter_stack_and_queue.png" alt="" style="height: 14.302%; left: 62.646%; top: 77.875%;">
|
||||
<span style="left: 77.571%; top: 91.25%;">栈与队列</span>
|
||||
</a>
|
||||
<a href="chapter_hashing/">
|
||||
<img src="assets/hero/chapter_hashing.png" alt="" style="height: 15.266%; left: 63.281%; top: 27.933%;">
|
||||
<span style="left: 68.862%; top: 46.292%;">哈希表</span>
|
||||
</a>
|
||||
<a href="chapter_tree/">
|
||||
<img src="assets/hero/chapter_tree.png" alt="" style="height: 19.615%; left: 80.137%; top: 26.678%;">
|
||||
<span style="left: 96.159%; top: 44.8%;">树</span>
|
||||
</a>
|
||||
<a href="chapter_heap/">
|
||||
<img src="assets/hero/chapter_heap.png" alt="" style="height: 10.566%; left: 77.226%; top: 11.559%;">
|
||||
<span style="left: 88.103%; top: 15.422%;">堆</span>
|
||||
</a>
|
||||
<a href="chapter_graph/">
|
||||
<img src="assets/hero/chapter_graph.png" alt="" style="height: 16.112%; left: 51.854%; top: 5.575%;">
|
||||
<span style="left: 71.195%; top: 6.503%;">图</span>
|
||||
</a>
|
||||
<a href="chapter_searching/">
|
||||
<img src="assets/hero/chapter_searching.png" alt="" style="height: 15.149%; left: 18.185%; top: 16.404%;">
|
||||
<span style="left: 14.556%; top: 20.876%;">搜索</span>
|
||||
</a>
|
||||
<a href="chapter_sorting/">
|
||||
<img src="assets/hero/chapter_sorting.png" alt="" style="height: 9.574%; left: 25.409%; top: 40.747%;">
|
||||
<span style="left: 28.805%; top: 53.808%;">排序</span>
|
||||
</a>
|
||||
<a href="chapter_divide_and_conquer/">
|
||||
<img src="assets/hero/chapter_divide_and_conquer.png" alt="" style="height: 18.681%; left: 32.721%; top: 4.816%;">
|
||||
<span style="left: 31.42%; top: 8.679%;">分治</span>
|
||||
</a>
|
||||
<a href="chapter_backtracking/">
|
||||
<img src="assets/hero/chapter_backtracking.png" alt="" style="height: 17.338%; left: 4.875%; top: 32.925%;">
|
||||
<span style="left: 4.742%; top: 50.113%;">回溯</span>
|
||||
</a>
|
||||
<a href="chapter_dynamic_programming/">
|
||||
<img src="assets/hero/chapter_dynamic_programming.png" alt="" style="height: 15.47%; left: 9.406%; top: 57.472%;">
|
||||
<span style="left: 8.561%; top: 75.351%;">动态规划</span>
|
||||
</a>
|
||||
<a href="chapter_greedy/">
|
||||
<img src="assets/hero/chapter_greedy.png" alt="" style="height: 14.127%; left: 23.132%; top: 75.803%;">
|
||||
<span style="left: 21.619%; top: 86.85%;">贪心</span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- heading -->
|
||||
<div class="heading-div">
|
||||
<img style="height: min(9vh, 12vw);" src="https://readme-typing-svg.demolab.com/?font=Noto+Sans+SC&weight=400&duration=3500&pause=2000&color=FFF¢er=true&vCenter=true&random=false&width=200&lines=Hello%2C+%E7%AE%97%E6%B3%95+!" alt="" />
|
||||
<div style="pointer-events: auto;">
|
||||
<p style="margin-top: max(-1vh, -2vw); margin-bottom: min(2vh, 3.5vw);">
|
||||
动画图解、一键运行的数据结构与算法教程
|
||||
</p>
|
||||
<a href="chapter_hello_algo/" class="rounded-button">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
|
||||
<path d="M160 96a96 96 0 1 1 192 0A96 96 0 1 1 160 96zm80 152V512l-48.4-24.2c-20.9-10.4-43.5-17-66.8-19.3l-96-9.6C12.5 457.2 0 443.5 0 427V224c0-17.7 14.3-32 32-32H62.3c63.6 0 125.6 19.6 177.7 56zm32 264V248c52.1-36.4 114.1-56 177.7-56H480c17.7 0 32 14.3 32 32V427c0 16.4-12.5 30.2-28.8 31.8l-96 9.6c-23.2 2.3-45.9 8.9-66.8 19.3L272 512z" />
|
||||
</svg>
|
||||
<span>开始阅读</span>
|
||||
</a>
|
||||
<a href="https://github.com/krahets/hello-algo" class="rounded-button">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 496 512">
|
||||
<path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3 .3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5 .3-6.2 2.3zm44.2-1.7c-2.9 .7-4.9 2.6-4.6 4.9 .3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3 .7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3 .3 2.9 2.3 3.9 1.6 1 3.6 .7 4.3-.7 .7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3 .7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3 .7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z">
|
||||
</path>
|
||||
</svg>
|
||||
<span>GitHub</span>
|
||||
</a>
|
||||
</div>
|
||||
<!-- arrow -->
|
||||
<div style="text-align: center; margin-top: min(2.5vh, 3.5vw);">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="var(--md-default-fg-color)" height="2vh" viewBox="0 0 384 512">
|
||||
<path d="M169.4 470.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 370.8 224 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 306.7L54.6 265.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z" />
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Generated from the shared homepage template and locale configuration. -->
|
||||
<link href="assets/home/ad8bb1cc4c28091c/hero-motion.css" rel="stylesheet"/>
|
||||
<noscript>
|
||||
<style>
|
||||
[data-home-src], video[data-home-poster] { display: none; }
|
||||
</style>
|
||||
</noscript>
|
||||
<section class="home-div home-universe-bg" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="starfield">
|
||||
<div class="starfield-origin">
|
||||
</div>
|
||||
</div>
|
||||
<div class="hero-div" data-home-layout="universe">
|
||||
<img alt="" data-hero-asset="ground" data-source-height="380" data-source-width="881" height="380" loading="lazy" src="assets/home/ad8bb1cc4c28091c/../shared/images/567306c070a6a7e2/ground.webp" style="position: absolute; width: auto; height: 26.445%; left: 28.211%; top: 54.145%;" width="881"/>
|
||||
<img alt="" data-hero-asset="links" data-source-height="1134" data-source-width="1562" height="1134" loading="lazy" src="assets/home/ad8bb1cc4c28091c/../shared/images/3e50f38a325c1cb5/links.webp" style="position: absolute; width: auto; height: 78.751%; left: 10.545%; top: 7.326%;" width="1562"/>
|
||||
<a href="chapter_introduction/">
|
||||
<img alt="" data-hero-asset="astronaut" data-source-height="672" data-source-width="515" height="672" src="assets/home/ad8bb1cc4c28091c/../shared/images/8e5eb3b3e3ebd9f7/astronaut.webp" style="height: 46.673%; left: 35.413%; top: 24.343%;" width="515"/>
|
||||
<span style="left: 52.244%; top: 20.919%;">
|
||||
初识算法
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_computational_complexity/">
|
||||
<img alt="" data-hero-asset="chapter_computational_complexity" data-source-height="178" data-source-width="113" height="178" src="assets/home/ad8bb1cc4c28091c/../shared/images/2fb425426d1f8d86/chapter_computational_complexity.webp" style="height: 12.347%; left: 36.267%; top: 37.653%;" width="113"/>
|
||||
<span style="left: 39.244%; top: 33.919%;">
|
||||
复杂度
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_array_and_linkedlist/">
|
||||
<img alt="" data-hero-asset="chapter_array_and_linkedlist" data-source-height="319" data-source-width="468" height="319" src="assets/home/ad8bb1cc4c28091c/../shared/images/5cbbdf7be555d3ef/chapter_array_and_linkedlist.webp" style="height: 22.242%; left: 73.242%; top: 52.481%;" width="468"/>
|
||||
<span style="left: 90.897%; top: 76.259%;">
|
||||
数组与链表
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_stack_and_queue/">
|
||||
<img alt="" data-hero-asset="chapter_stack_and_queue" data-source-height="204" data-source-width="204" height="204" src="assets/home/ad8bb1cc4c28091c/../shared/images/e2667767cf7481bd/chapter_stack_and_queue.webp" style="height: 14.302%; left: 62.646%; top: 77.875%;" width="204"/>
|
||||
<span style="left: 77.571%; top: 91.25%;">
|
||||
栈与队列
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_hashing/">
|
||||
<img alt="" data-hero-asset="chapter_hashing" data-source-height="218" data-source-width="218" height="218" src="assets/home/ad8bb1cc4c28091c/../shared/images/b108d70a537714cb/chapter_hashing.webp" style="height: 15.266%; left: 63.281%; top: 27.933%;" width="218"/>
|
||||
<span style="left: 68.862%; top: 46.292%;">
|
||||
哈希表
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_tree/">
|
||||
<img alt="" data-hero-asset="chapter_tree" data-source-height="281" data-source-width="280" height="281" src="assets/home/ad8bb1cc4c28091c/../shared/images/8138bb0acecedec4/chapter_tree.webp" style="height: 19.615%; left: 80.137%; top: 26.678%;" width="280"/>
|
||||
<span style="left: 96.159%; top: 44.8%;">
|
||||
树
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_heap/">
|
||||
<img alt="" data-hero-asset="chapter_heap" data-source-height="152" data-source-width="151" height="152" src="assets/home/ad8bb1cc4c28091c/../shared/images/7586281e6691807a/chapter_heap.webp" style="height: 10.566%; left: 77.226%; top: 11.559%;" width="151"/>
|
||||
<span style="left: 88.103%; top: 15.422%;">
|
||||
堆
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_graph/">
|
||||
<img alt="" data-hero-asset="chapter_graph" data-source-height="272" data-source-width="542" height="272" src="assets/home/ad8bb1cc4c28091c/../shared/images/175a7f2e7c3cf5f0/chapter_graph.webp" style="height: 16.112%; left: 51.854%; top: 5.575%;" width="542"/>
|
||||
<span style="left: 71.195%; top: 6.503%;">
|
||||
图
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_searching/">
|
||||
<img alt="" data-hero-asset="chapter_searching" data-source-height="216" data-source-width="216" height="216" src="assets/home/ad8bb1cc4c28091c/../shared/images/ebfe2b953dbb9d90/chapter_searching.webp" style="height: 15.149%; left: 18.185%; top: 16.404%;" width="216"/>
|
||||
<span style="left: 14.556%; top: 20.876%;">
|
||||
搜索
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_sorting/">
|
||||
<img alt="" data-hero-asset="chapter_sorting" data-source-height="137" data-source-width="138" height="137" src="assets/home/ad8bb1cc4c28091c/../shared/images/9d4be68b2680967c/chapter_sorting.webp" style="height: 9.574%; left: 25.409%; top: 40.747%;" width="138"/>
|
||||
<span style="left: 28.805%; top: 53.808%;">
|
||||
排序
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_divide_and_conquer/">
|
||||
<img alt="" data-hero-asset="chapter_divide_and_conquer" data-source-height="269" data-source-width="407" height="269" src="assets/home/ad8bb1cc4c28091c/../shared/images/6f5766ca9385cd2e/chapter_divide_and_conquer.webp" style="height: 18.681%; left: 32.721%; top: 4.816%;" width="407"/>
|
||||
<span style="left: 31.42%; top: 8.679%;">
|
||||
分治
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_backtracking/">
|
||||
<img alt="" data-hero-asset="chapter_backtracking" data-source-height="249" data-source-width="345" height="249" src="assets/home/ad8bb1cc4c28091c/../shared/images/176675e685febf11/chapter_backtracking.webp" style="height: 17.338%; left: 4.875%; top: 32.925%;" width="345"/>
|
||||
<span style="left: 4.742%; top: 50.113%;">
|
||||
回溯
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_dynamic_programming/">
|
||||
<img alt="" data-hero-asset="chapter_dynamic_programming" data-source-height="268" data-source-width="267" height="268" src="assets/home/ad8bb1cc4c28091c/../shared/images/06264b1ffd05b08e/chapter_dynamic_programming.webp" style="height: 15.47%; left: 9.406%; top: 57.472%;" width="267"/>
|
||||
<span style="left: 8.561%; top: 75.351%;">
|
||||
动态规划
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_greedy/">
|
||||
<img alt="" data-hero-asset="chapter_greedy" data-source-height="202" data-source-width="265" height="202" src="assets/home/ad8bb1cc4c28091c/../shared/images/2ce6caaac951c40b/chapter_greedy.webp" style="height: 14.127%; left: 23.132%; top: 75.803%;" width="265"/>
|
||||
<span style="left: 21.619%; top: 86.85%;">
|
||||
贪心
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="heading-div">
|
||||
<img alt="" loading="lazy" src="https://readme-typing-svg.demolab.com/?font=Noto+Sans+SC&weight=400&duration=3500&pause=2000&color=FFF&center=true&vCenter=true&random=false&width=200&lines=Hello%2C+%E7%AE%97%E6%B3%95+!" style="height: min(9vh, 12vw);"/>
|
||||
<div style="pointer-events: auto;">
|
||||
<p style="margin-top: max(-1vh, -2vw); margin-bottom: min(2vh, 3.5vw);">
|
||||
动画图解、一键运行的数据结构与算法教程
|
||||
</p>
|
||||
<a class="rounded-button" href="chapter_hello_algo/">
|
||||
<svg viewbox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
|
||||
<path d="M160 96a96 96 0 1 1 192 0A96 96 0 1 1 160 96zm80 152V512l-48.4-24.2c-20.9-10.4-43.5-17-66.8-19.3l-96-9.6C12.5 457.2 0 443.5 0 427V224c0-17.7 14.3-32 32-32H62.3c63.6 0 125.6 19.6 177.7 56zm32 264V248c52.1-36.4 114.1-56 177.7-56H480c17.7 0 32 14.3 32 32V427c0 16.4-12.5 30.2-28.8 31.8l-96 9.6c-23.2 2.3-45.9 8.9-66.8 19.3L272 512z">
|
||||
</path>
|
||||
</svg>
|
||||
<span>
|
||||
开始阅读
|
||||
</span>
|
||||
</a>
|
||||
<a class="rounded-button" href="https://github.com/krahets/hello-algo">
|
||||
<svg viewbox="0 0 496 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3 .3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5 .3-6.2 2.3zm44.2-1.7c-2.9 .7-4.9 2.6-4.6 4.9 .3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3 .7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3 .3 2.9 2.3 3.9 1.6 1 3.6 .7 4.3-.7 .7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3 .7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3 .7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z">
|
||||
</path>
|
||||
</svg>
|
||||
<span>
|
||||
GitHub
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<div style="text-align: center; margin-top: min(2.5vh, 3.5vw);">
|
||||
<svg fill="var(--md-default-fg-color)" height="2vh" viewbox="0 0 384 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M169.4 470.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 370.8 224 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 306.7L54.6 265.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z">
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Section: reading -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content">
|
||||
<div class="reading-media">
|
||||
<!-- devices -->
|
||||
<!-- book height = 250 mm -->
|
||||
<!-- mac height = 248.1 mm -->
|
||||
<!-- ipad height = 280.6mm -->
|
||||
<!-- iphone height = 160.7mm -->
|
||||
<div class="media-block">
|
||||
<a href="chapter_paperbook/">
|
||||
<div style="height: 8.17%;"></div>
|
||||
<img class="device-on-hover" style="height: 66.83%;" src="assets/hero/cover_render.png" alt="Cover">
|
||||
<div class="text-button">
|
||||
<span>了解纸质书</span>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z" />
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="media-block">
|
||||
<a href="chapter_hello_algo/">
|
||||
<div style="height: 4.34%;"></div>
|
||||
<img class="device-on-hover" style="height: 66.31%;" src="assets/hero/web_mac_iphone.png" alt="">
|
||||
<div style="height: 4.34%;"></div>
|
||||
<div class="text-button">
|
||||
<span>在线阅读</span>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z" />
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="media-block">
|
||||
<a href="https://github.com/krahets/hello-algo/releases">
|
||||
<img class="device-on-hover" style="height: 75%;" src="assets/hero/pdf_ipad.png" alt="">
|
||||
<div class="text-button">
|
||||
<span>下载 PDF/EPUB</span>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z" />
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<p style="margin-top: 2em;">500 幅动画图解、14 种编程语言代码、3000 条社区问答，助你快速入门数据结构与算法</p>
|
||||
</div>
|
||||
<section class="home-div" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="section-content">
|
||||
<div class="reading-media">
|
||||
<div class="media-block">
|
||||
<a href="chapter_paperbook/">
|
||||
<div style="height: 8.17%;">
|
||||
</div>
|
||||
<img alt="Cover" class="device-on-hover" data-home-src="assets/home/ad8bb1cc4c28091c/../shared/images/dc5be783cea3a262/cover_render.webp" decoding="async" height="720" style="height: 66.83%;" width="535"/>
|
||||
<noscript>
|
||||
<img alt="Cover" class="device-on-hover" height="720" loading="lazy" src="assets/home/ad8bb1cc4c28091c/../shared/images/dc5be783cea3a262/cover_render.webp" style="height: 66.83%;" width="535"/>
|
||||
</noscript>
|
||||
<div class="text-button">
|
||||
<span>
|
||||
了解纸质书
|
||||
</span>
|
||||
<svg viewbox="0 0 320 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z">
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="media-block">
|
||||
<a href="chapter_hello_algo/">
|
||||
<div style="height: 4.34%;">
|
||||
</div>
|
||||
<img alt="" class="device-on-hover" data-home-src="assets/home/ad8bb1cc4c28091c/../shared/images/5b64cf7672ec5ec6/web_mac_iphone.webp" decoding="async" height="965" style="height: 66.31%;" width="1598"/>
|
||||
<noscript>
|
||||
<img alt="" class="device-on-hover" height="965" loading="lazy" src="assets/home/ad8bb1cc4c28091c/../shared/images/5b64cf7672ec5ec6/web_mac_iphone.webp" style="height: 66.31%;" width="1598"/>
|
||||
</noscript>
|
||||
<div style="height: 4.34%;">
|
||||
</div>
|
||||
<div class="text-button">
|
||||
<span>
|
||||
在线阅读
|
||||
</span>
|
||||
<svg viewbox="0 0 320 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z">
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="media-block">
|
||||
<a href="https://github.com/krahets/hello-algo/releases">
|
||||
<img alt="" class="device-on-hover" data-home-src="assets/home/ad8bb1cc4c28091c/../shared/images/66baa2f9bf3abec7/pdf_ipad.webp" decoding="async" height="960" style="height: 75%;" width="812"/>
|
||||
<noscript>
|
||||
<img alt="" class="device-on-hover" height="960" loading="lazy" src="assets/home/ad8bb1cc4c28091c/../shared/images/66baa2f9bf3abec7/pdf_ipad.webp" style="height: 75%;" width="812"/>
|
||||
</noscript>
|
||||
<div class="text-button">
|
||||
<span>
|
||||
下载 PDF/EPUB
|
||||
</span>
|
||||
<svg viewbox="0 0 320 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z">
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<p style="margin-top: 2em;">
|
||||
500 幅动画图解、14 种编程语言代码、3000 条社区问答，助你快速入门数据结构与算法
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Section: endorsements -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content">
|
||||
<h3 style="text-align: center; margin: 1em auto;">推荐语</h3>
|
||||
<div class="intro-container endor-container">
|
||||
<div class="intro-text endor-text">
|
||||
<p style="margin-bottom: 0;">“一本通俗易懂的数据结构与算法入门书，引导读者手脑并用地学习，强烈推荐算法初学者阅读。”</p>
|
||||
<p style="font-weight: bold;">—— 邓俊辉，清华大学计算机系教授</p>
|
||||
</div>
|
||||
<div class="intro-text endor-text">
|
||||
<p style="margin-bottom: 0;">“如果我当年学数据结构与算法的时候有《Hello 算法》，学起来应该会简单 10 倍！”</p>
|
||||
<p style="font-weight: bold;">—— 李沐，亚马逊资深首席科学家</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<section class="home-div" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="section-content">
|
||||
<h3 style="text-align: center; margin: 1em auto;">
|
||||
推荐语
|
||||
</h3>
|
||||
<div class="intro-container endor-container">
|
||||
<div class="intro-text endor-text">
|
||||
<p style="margin-bottom: 0;">
|
||||
“一本通俗易懂的数据结构与算法入门书，引导读者手脑并用地学习，强烈推荐算法初学者阅读。”
|
||||
</p>
|
||||
<p style="font-weight: bold;">
|
||||
—— 邓俊辉，清华大学计算机系教授
|
||||
</p>
|
||||
</div>
|
||||
<div class="intro-text endor-text">
|
||||
<p style="margin-bottom: 0;">
|
||||
“如果我当年学数据结构与算法的时候有《Hello 算法》，学起来应该会简单 10 倍！”
|
||||
</p>
|
||||
<p style="font-weight: bold;">
|
||||
—— 李沐，亚马逊资深首席科学家
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Section: features -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content">
|
||||
<div class="intro-container">
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="1.5em" width="1.5em" viewBox="0 0 640 512">
|
||||
<path fill="var(--md-primary-bg-color)" d="M256 0H576c35.3 0 64 28.7 64 64V288c0 35.3-28.7 64-64 64H256c-35.3 0-64-28.7-64-64V64c0-35.3 28.7-64 64-64zM476 106.7C471.5 100 464 96 456 96s-15.5 4-20 10.7l-56 84L362.7 169c-4.6-5.7-11.5-9-18.7-9s-14.2 3.3-18.7 9l-64 80c-5.8 7.2-6.9 17.1-2.9 25.4s12.4 13.6 21.6 13.6h80 48H552c8.9 0 17-4.9 21.2-12.7s3.7-17.3-1.2-24.6l-96-144zM336 96a32 32 0 1 0 -64 0 32 32 0 1 0 64 0zM64 128h96V384v32c0 17.7 14.3 32 32 32H320c17.7 0 32-14.3 32-32V384H512v64c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V192c0-35.3 28.7-64 64-64zm8 64c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V208c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V312c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H72zm336 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H424c-8.8 0-16 7.2-16 16z" />
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">动画图解</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">内容清晰易懂，学习曲线平滑</p>
|
||||
<p class="intro-quote">"A picture is worth a thousand words."<br>“一图胜千言”</p>
|
||||
</div>
|
||||
</div>
|
||||
<video class="intro-image" src="index.assets/animation.mp4" autoplay loop muted playsinline aria-label="Animation example"></video>
|
||||
</div>
|
||||
|
||||
<div class="intro-container">
|
||||
<video class="intro-image" src="index.assets/running_code.mp4" autoplay loop muted playsinline aria-label="Running code example"></video>
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="1.5em" width="1.5em" viewBox="0 0 640 512">
|
||||
<path fill="var(--md-primary-bg-color)" d="M392.8 1.2c-17-4.9-34.7 5-39.6 22l-128 448c-4.9 17 5 34.7 22 39.6s34.7-5 39.6-22l128-448c4.9-17-5-34.7-22-39.6zm80.6 120.1c-12.5 12.5-12.5 32.8 0 45.3L562.7 256l-89.4 89.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l112-112c12.5-12.5 12.5-32.8 0-45.3l-112-112c-12.5-12.5-32.8-12.5-45.3 0zm-306.7 0c-12.5-12.5-32.8-12.5-45.3 0l-112 112c-12.5 12.5-12.5 32.8 0 45.3l112 112c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256l89.4-89.4c12.5-12.5 12.5-32.8 0-45.3z" />
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">一键运行</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">十余种编程语言，代码可视化运行</p>
|
||||
<p class="intro-quote">"Talk is cheap. Show me the code."<br>“少吹牛，看代码”</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="intro-container">
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="1.5em" width="1.5em" viewBox="0 0 640 512">
|
||||
<path fill="var(--md-primary-bg-color)" d="M88.2 309.1c9.8-18.3 6.8-40.8-7.5-55.8C59.4 230.9 48 204 48 176c0-63.5 63.8-128 160-128s160 64.5 160 128s-63.8 128-160 128c-13.1 0-25.8-1.3-37.8-3.6c-10.4-2-21.2-.6-30.7 4.2c-4.1 2.1-8.3 4.1-12.6 6c-16 7.2-32.9 13.5-49.9 18c2.8-4.6 5.4-9.1 7.9-13.6c1.1-1.9 2.2-3.9 3.2-5.9zM0 176c0 41.8 17.2 80.1 45.9 110.3c-.9 1.7-1.9 3.5-2.8 5.1c-10.3 18.4-22.3 36.5-36.6 52.1c-6.6 7-8.3 17.2-4.6 25.9C5.8 378.3 14.4 384 24 384c43 0 86.5-13.3 122.7-29.7c4.8-2.2 9.6-4.5 14.2-6.8c15.1 3 30.9 4.5 47.1 4.5c114.9 0 208-78.8 208-176S322.9 0 208 0S0 78.8 0 176zM432 480c16.2 0 31.9-1.6 47.1-4.5c4.6 2.3 9.4 4.6 14.2 6.8C529.5 498.7 573 512 616 512c9.6 0 18.2-5.7 22-14.5c3.8-8.8 2-19-4.6-25.9c-14.2-15.6-26.2-33.7-36.6-52.1c-.9-1.7-1.9-3.4-2.8-5.1C622.8 384.1 640 345.8 640 304c0-94.4-87.9-171.5-198.2-175.8c4.1 15.2 6.2 31.2 6.2 47.8l0 .6c87.2 6.7 144 67.5 144 127.4c0 28-11.4 54.9-32.7 77.2c-14.3 15-17.3 37.6-7.5 55.8c1.1 2 2.2 4 3.2 5.9c2.5 4.5 5.2 9 7.9 13.6c-17-4.5-33.9-10.7-49.9-18c-4.3-1.9-8.5-3.9-12.6-6c-9.5-4.8-20.3-6.2-30.7-4.2c-12.1 2.4-24.7 3.6-37.8 3.6c-61.7 0-110-26.5-136.8-62.3c-16 5.4-32.8 9.4-50 11.8C279 439.8 350 480 432 480z" />
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">互助学习</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">欢迎讨论与提问，读者间携手共进</p>
|
||||
<p class="intro-quote">"Learning by teaching."<br>“教学相长”</p>
|
||||
</div>
|
||||
</div>
|
||||
<video class="intro-image" src="index.assets/comment.mp4" autoplay loop muted playsinline aria-label="Comments example"></video>
|
||||
</div>
|
||||
|
||||
<section class="home-div" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="section-content">
|
||||
<div class="intro-container">
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg height="1.5em" viewbox="0 0 640 512" width="1.5em" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M256 0H576c35.3 0 64 28.7 64 64V288c0 35.3-28.7 64-64 64H256c-35.3 0-64-28.7-64-64V64c0-35.3 28.7-64 64-64zM476 106.7C471.5 100 464 96 456 96s-15.5 4-20 10.7l-56 84L362.7 169c-4.6-5.7-11.5-9-18.7-9s-14.2 3.3-18.7 9l-64 80c-5.8 7.2-6.9 17.1-2.9 25.4s12.4 13.6 21.6 13.6h80 48H552c8.9 0 17-4.9 21.2-12.7s3.7-17.3-1.2-24.6l-96-144zM336 96a32 32 0 1 0 -64 0 32 32 0 1 0 64 0zM64 128h96V384v32c0 17.7 14.3 32 32 32H320c17.7 0 32-14.3 32-32V384H512v64c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V192c0-35.3 28.7-64 64-64zm8 64c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V208c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V312c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H72zm336 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H424c-8.8 0-16 7.2-16 16z" fill="var(--md-primary-bg-color)">
|
||||
</path>
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">
|
||||
动画图解
|
||||
</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">
|
||||
内容清晰易懂，学习曲线平滑
|
||||
</p>
|
||||
<p class="intro-quote">
|
||||
"A picture is worth a thousand words."
|
||||
<br/>
|
||||
“一图胜千言”
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Section: contributors -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content" style="max-width: 90vw;">
|
||||
<!-- author -->
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>作者</h3>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/krahets">
|
||||
<img class="profile-img" src="assets/avatar/avatar_yudongjin.jpg" alt="Author: yudongjin" />
|
||||
<br><b>靳宇栋（@krahets）</b>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- code reviewers -->
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>代码审阅者</h3>
|
||||
<p>本书多语言代码版本由以下开发者协力完成，感谢他们的投入与贡献！</p>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/coderonion">
|
||||
<img class="profile-img" src="assets/avatar/avatar_coderonion.jpg" alt="Reviewer: coderonion" />
|
||||
<br><b>coderonion</b>
|
||||
<br><sub>Zig, Rust</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/curtishd">
|
||||
<img class="profile-img" src="assets/avatar/avatar_curtishd.jpg" alt="Reviewer: curtishd" />
|
||||
<br><b>curtishd</b>
|
||||
<br><sub>Kotlin</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/Gonglja">
|
||||
<img class="profile-img" src="assets/avatar/avatar_Gonglja.jpg" alt="Reviewer: Gonglja" />
|
||||
<br><b>Gonglja</b>
|
||||
<br><sub>C, C++</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/gvenusleo">
|
||||
<img class="profile-img" src="assets/avatar/avatar_gvenusleo.jpg" alt="Reviewer: gvenusleo" />
|
||||
<br><b>gvenusleo</b>
|
||||
<br><sub>Dart</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/hpstory">
|
||||
<img class="profile-img" src="assets/avatar/avatar_hpstory.jpg" alt="Reviewer: hpstory" />
|
||||
<br><b>hpstory</b>
|
||||
<br><sub>C#</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/justin-tse">
|
||||
<img class="profile-img" src="assets/avatar/avatar_justin-tse.jpg" alt="Reviewer: justin-tse" />
|
||||
<br><b>justin-tse</b>
|
||||
<br><sub>JS, TS</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/khoaxuantu">
|
||||
<img class="profile-img" src="assets/avatar/avatar_khoaxuantu.jpg" alt="Reviewer: khoaxuantu" />
|
||||
<br><b>khoaxuantu</b>
|
||||
<br><sub>Ruby</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/krahets">
|
||||
<img class="profile-img" src="assets/avatar/avatar_krahets.jpg" alt="Reviewer: krahets" />
|
||||
<br><b>krahets</b>
|
||||
<br><sub>Python, Java</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/night-cruise">
|
||||
<img class="profile-img" src="assets/avatar/avatar_night-cruise.jpg" alt="Reviewer: night-cruise" />
|
||||
<br><b>night-cruise</b>
|
||||
<br><sub>Rust</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/nuomi1">
|
||||
<img class="profile-img" src="assets/avatar/avatar_nuomi1.jpg" alt="Reviewer: nuomi1" />
|
||||
<br><b>nuomi1</b>
|
||||
<br><sub>Swift</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/Reanon">
|
||||
<img class="profile-img" src="assets/avatar/avatar_Reanon.jpg" alt="Reviewer: Reanon" />
|
||||
<br><b>Reanon</b>
|
||||
<br><sub>Go, C</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/rongyi">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_rongyi.jpg" alt="Reviewer: rongyi" />
|
||||
<br><b>rongyi</b>
|
||||
<br><sub>Rust</sub>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- contributors -->
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>贡献者</h3>
|
||||
<p>本书在开源社区 200 多位贡献者的共同努力下不断完善，感谢他们付出的时间与精力！</p>
|
||||
<a href="https://github.com/krahets/hello-algo/graphs/contributors">
|
||||
<img src="https://contrib.rocks/image?repo=krahets/hello-algo&max=300&columns=12" alt="Contributors" style="width: 100%; max-width: 38.5em;">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<video aria-label="Animation example" class="intro-image" data-home-poster="assets/home/ad8bb1cc4c28091c/../shared/images/9e5f39bf33afc70f/animation-poster.webp" data-home-video="assets/home/ad8bb1cc4c28091c/../shared/media/6c70de2b2bf4eef7/animation.mp4" height="1080" loop="" muted="" playsinline="" preload="none" style="aspect-ratio: 1600 / 1080" width="1600">
|
||||
</video>
|
||||
<noscript>
|
||||
<a href="assets/home/ad8bb1cc4c28091c/../shared/media/6c70de2b2bf4eef7/animation.mp4">
|
||||
<img alt="Animation example" class="intro-image" height="1080" src="assets/home/ad8bb1cc4c28091c/../shared/images/9e5f39bf33afc70f/animation-poster.webp" width="1600"/>
|
||||
动画图解
|
||||
</a>
|
||||
</noscript>
|
||||
</div>
|
||||
<div class="intro-container">
|
||||
<video aria-label="Running code example" class="intro-image" data-home-poster="assets/home/ad8bb1cc4c28091c/../shared/images/f33a13e8331245ae/running_code-poster.webp" data-home-video="assets/home/ad8bb1cc4c28091c/../shared/media/bb169a96ca8316da/running_code.mp4" height="1082" loop="" muted="" playsinline="" preload="none" style="aspect-ratio: 1600 / 1082" width="1600">
|
||||
</video>
|
||||
<noscript>
|
||||
<a href="assets/home/ad8bb1cc4c28091c/../shared/media/bb169a96ca8316da/running_code.mp4">
|
||||
<img alt="Running code example" class="intro-image" height="1082" src="assets/home/ad8bb1cc4c28091c/../shared/images/f33a13e8331245ae/running_code-poster.webp" width="1600"/>
|
||||
一键运行
|
||||
</a>
|
||||
</noscript>
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg height="1.5em" viewbox="0 0 640 512" width="1.5em" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M392.8 1.2c-17-4.9-34.7 5-39.6 22l-128 448c-4.9 17 5 34.7 22 39.6s34.7-5 39.6-22l128-448c4.9-17-5-34.7-22-39.6zm80.6 120.1c-12.5 12.5-12.5 32.8 0 45.3L562.7 256l-89.4 89.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l112-112c12.5-12.5 12.5-32.8 0-45.3l-112-112c-12.5-12.5-32.8-12.5-45.3 0zm-306.7 0c-12.5-12.5-32.8-12.5-45.3 0l-112 112c-12.5 12.5-12.5 32.8 0 45.3l112 112c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256l89.4-89.4c12.5-12.5 12.5-32.8 0-45.3z" fill="var(--md-primary-bg-color)">
|
||||
</path>
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">
|
||||
一键运行
|
||||
</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">
|
||||
十余种编程语言，代码可视化运行
|
||||
</p>
|
||||
<p class="intro-quote">
|
||||
"Talk is cheap. Show me the code."
|
||||
<br/>
|
||||
“少吹牛，看代码”
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="intro-container">
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg height="1.5em" viewbox="0 0 640 512" width="1.5em" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M88.2 309.1c9.8-18.3 6.8-40.8-7.5-55.8C59.4 230.9 48 204 48 176c0-63.5 63.8-128 160-128s160 64.5 160 128s-63.8 128-160 128c-13.1 0-25.8-1.3-37.8-3.6c-10.4-2-21.2-.6-30.7 4.2c-4.1 2.1-8.3 4.1-12.6 6c-16 7.2-32.9 13.5-49.9 18c2.8-4.6 5.4-9.1 7.9-13.6c1.1-1.9 2.2-3.9 3.2-5.9zM0 176c0 41.8 17.2 80.1 45.9 110.3c-.9 1.7-1.9 3.5-2.8 5.1c-10.3 18.4-22.3 36.5-36.6 52.1c-6.6 7-8.3 17.2-4.6 25.9C5.8 378.3 14.4 384 24 384c43 0 86.5-13.3 122.7-29.7c4.8-2.2 9.6-4.5 14.2-6.8c15.1 3 30.9 4.5 47.1 4.5c114.9 0 208-78.8 208-176S322.9 0 208 0S0 78.8 0 176zM432 480c16.2 0 31.9-1.6 47.1-4.5c4.6 2.3 9.4 4.6 14.2 6.8C529.5 498.7 573 512 616 512c9.6 0 18.2-5.7 22-14.5c3.8-8.8 2-19-4.6-25.9c-14.2-15.6-26.2-33.7-36.6-52.1c-.9-1.7-1.9-3.4-2.8-5.1C622.8 384.1 640 345.8 640 304c0-94.4-87.9-171.5-198.2-175.8c4.1 15.2 6.2 31.2 6.2 47.8l0 .6c87.2 6.7 144 67.5 144 127.4c0 28-11.4 54.9-32.7 77.2c-14.3 15-17.3 37.6-7.5 55.8c1.1 2 2.2 4 3.2 5.9c2.5 4.5 5.2 9 7.9 13.6c-17-4.5-33.9-10.7-49.9-18c-4.3-1.9-8.5-3.9-12.6-6c-9.5-4.8-20.3-6.2-30.7-4.2c-12.1 2.4-24.7 3.6-37.8 3.6c-61.7 0-110-26.5-136.8-62.3c-16 5.4-32.8 9.4-50 11.8C279 439.8 350 480 432 480z" fill="var(--md-primary-bg-color)">
|
||||
</path>
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">
|
||||
互助学习
|
||||
</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">
|
||||
欢迎讨论与提问，读者间携手共进
|
||||
</p>
|
||||
<p class="intro-quote">
|
||||
"Learning by teaching."
|
||||
<br/>
|
||||
“教学相长”
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<video aria-label="Comments example" class="intro-image" data-home-poster="assets/home/ad8bb1cc4c28091c/../shared/images/f9ac69536a7582f5/comment-poster.webp" data-home-video="assets/home/ad8bb1cc4c28091c/../shared/media/62aa0b8d351c63a7/comment.mp4" height="1080" loop="" muted="" playsinline="" preload="none" style="aspect-ratio: 1600 / 1080" width="1600">
|
||||
</video>
|
||||
<noscript>
|
||||
<a href="assets/home/ad8bb1cc4c28091c/../shared/media/62aa0b8d351c63a7/comment.mp4">
|
||||
<img alt="Comments example" class="intro-image" height="1080" src="assets/home/ad8bb1cc4c28091c/../shared/images/f9ac69536a7582f5/comment-poster.webp" width="1600"/>
|
||||
互助学习
|
||||
</a>
|
||||
</noscript>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="home-div" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="section-content" style="max-width: 90vw;">
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>
|
||||
作者
|
||||
</h3>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/krahets">
|
||||
<img alt="Author: yudongjin" class="profile-img" height="512" loading="lazy" src="assets/home/ad8bb1cc4c28091c/../shared/images/02348410d40f7665/avatar_yudongjin.webp" width="512"/>
|
||||
<br/>
|
||||
<b>
|
||||
靳宇栋（@krahets）
|
||||
</b>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>
|
||||
代码审阅者
|
||||
</h3>
|
||||
<p>
|
||||
本书多语言代码版本由以下开发者协力完成，感谢他们的投入与贡献！
|
||||
</p>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/coderonion">
|
||||
<img alt="Reviewer: coderonion" class="profile-img" height="384" loading="lazy" src="assets/home/ad8bb1cc4c28091c/../shared/images/db606f27971eae34/avatar_coderonion.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
coderonion
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Zig, Rust
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/curtishd">
|
||||
<img alt="Reviewer: curtishd" class="profile-img" height="384" loading="lazy" src="assets/home/ad8bb1cc4c28091c/../shared/images/feedb0e547ea31fc/avatar_curtishd.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
curtishd
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Kotlin
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/Gonglja">
|
||||
<img alt="Reviewer: Gonglja" class="profile-img" height="384" loading="lazy" src="assets/home/ad8bb1cc4c28091c/../shared/images/cdcf023b032b8d30/avatar_Gonglja.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
Gonglja
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
C, C++
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/gvenusleo">
|
||||
<img alt="Reviewer: gvenusleo" class="profile-img" height="384" loading="lazy" src="assets/home/ad8bb1cc4c28091c/../shared/images/464e2d351b9263ec/avatar_gvenusleo.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
gvenusleo
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Dart
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/hpstory">
|
||||
<img alt="Reviewer: hpstory" class="profile-img" height="384" loading="lazy" src="assets/home/ad8bb1cc4c28091c/../shared/images/7b6478acdab6b845/avatar_hpstory.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
hpstory
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
C#
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/justin-tse">
|
||||
<img alt="Reviewer: justin-tse" class="profile-img" height="384" loading="lazy" src="assets/home/ad8bb1cc4c28091c/../shared/images/208ee5aae490eefa/avatar_justin-tse.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
justin-tse
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
JS, TS
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/khoaxuantu">
|
||||
<img alt="Reviewer: khoaxuantu" class="profile-img" height="384" loading="lazy" src="assets/home/ad8bb1cc4c28091c/../shared/images/9d3f1a21ff51de78/avatar_khoaxuantu.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
khoaxuantu
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Ruby
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/krahets">
|
||||
<img alt="Reviewer: krahets" class="profile-img" height="384" loading="lazy" src="assets/home/ad8bb1cc4c28091c/../shared/images/e321f9a3ac2739e0/avatar_krahets.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
krahets
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Python, Java
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/night-cruise">
|
||||
<img alt="Reviewer: night-cruise" class="profile-img" height="384" loading="lazy" src="assets/home/ad8bb1cc4c28091c/../shared/images/960b489efa22abd4/avatar_night-cruise.jpg" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
night-cruise
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Rust
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/nuomi1">
|
||||
<img alt="Reviewer: nuomi1" class="profile-img" height="384" loading="lazy" src="assets/home/ad8bb1cc4c28091c/../shared/images/7316a9eb4429b259/avatar_nuomi1.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
nuomi1
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Swift
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/Reanon">
|
||||
<img alt="Reviewer: Reanon" class="profile-img" height="384" loading="lazy" src="assets/home/ad8bb1cc4c28091c/../shared/images/dcc15aa68cc793c7/avatar_Reanon.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
Reanon
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Go, C
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/rongyi">
|
||||
<img alt="Reviewer: rongyi" class="profile-img" height="384" loading="lazy" src="assets/home/ad8bb1cc4c28091c/../shared/images/5dc6c4b1d8bfe0ac/avatar_rongyi.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
rongyi
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Rust
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>
|
||||
贡献者
|
||||
</h3>
|
||||
<p>
|
||||
本书在开源社区 200 多位贡献者的共同努力下不断完善，感谢他们付出的时间与精力！
|
||||
</p>
|
||||
<a href="https://github.com/krahets/hello-algo/graphs/contributors">
|
||||
<img alt="Contributors" loading="lazy" src="https://contrib.rocks/image?repo=krahets/hello-algo&max=300&columns=12" style="width: 100%; max-width: 38.5em;"/>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<!-- This independent fallback also works when the deferred loader cannot be fetched. -->
|
||||
<script defer="" onerror="document.querySelectorAll('[data-home-src], [data-home-poster]').forEach(function(el) { if (el.dataset.homeSrc) el.src = el.dataset.homeSrc; if (el.dataset.homePoster) el.poster = el.dataset.homePoster; });" src="assets/home/ad8bb1cc4c28091c/javascripts/homepage-media.js">
|
||||
</script>
|
||||
|
||||
BIN
en/docs/assets/hero/astronaut.webp
Normal file
BIN
en/docs/assets/hero/astronaut.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 274 KiB |
BIN
en/docs/assets/hero/ground.webp
Normal file
BIN
en/docs/assets/hero/ground.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 276 KiB |
@@ -1,324 +1,497 @@
|
||||
<!-- Section: hero -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div" style="height: min(100vh, 120vw); position: relative; margin-top:-2.4rem; padding: 0; overflow: hidden;">
|
||||
<!-- hero image -->
|
||||
<!-- <img alt="" class="hero-bg" src="assets/hero/universe_bg.png" /> -->
|
||||
<div class="starfield">
|
||||
<div class="starfield-origin"></div>
|
||||
</div>
|
||||
<div class="hero-div hero-div--en">
|
||||
<img src="assets/hero/ground.png" alt="" style="position: absolute; width: auto; height: 26.445%; left: 28.211%; top: 54.145%;">
|
||||
<img src="assets/hero/links.png" alt="" style="position: absolute; width: auto; height: 78.751%; left: 10.545%; top: 7.326%;">
|
||||
<a href="chapter_introduction/">
|
||||
<img src="assets/hero/astronaut.png" alt="" style="height: 46.673%; left: 35.413%; top: 24.343%;">
|
||||
<span style="left: 52.244%; top: 20.919%;">Getting to know algorithms</span>
|
||||
</a>
|
||||
<a href="chapter_computational_complexity/">
|
||||
<img src="assets/hero/chapter_computational_complexity.png" alt="" style="height: 12.347%; left: 36.267%; top: 37.653%;">
|
||||
<span style="left: 39.244%; top: 33.919%;">Complexity</span>
|
||||
</a>
|
||||
<a href="chapter_array_and_linkedlist/">
|
||||
<img src="assets/hero/chapter_array_and_linkedlist.png" alt="" style="height: 22.242%; left: 73.242%; top: 52.481%;">
|
||||
<span style="left: 90.897%; top: 76.259%;">Arrays and linked lists</span>
|
||||
</a>
|
||||
<a href="chapter_stack_and_queue/">
|
||||
<img src="assets/hero/chapter_stack_and_queue.png" alt="" style="height: 14.302%; left: 62.646%; top: 77.875%;">
|
||||
<span style="left: 77.571%; top: 91.25%;">Stacks and queues</span>
|
||||
</a>
|
||||
<a href="chapter_hashing/">
|
||||
<img src="assets/hero/chapter_hashing.png" alt="" style="height: 15.266%; left: 63.281%; top: 27.933%;">
|
||||
<span style="left: 68.862%; top: 46.292%;">Hash tables</span>
|
||||
</a>
|
||||
<a href="chapter_tree/">
|
||||
<img src="assets/hero/chapter_tree.png" alt="" style="height: 19.615%; left: 80.137%; top: 26.678%;">
|
||||
<span style="left: 96.159%; top: 44.8%;">Trees</span>
|
||||
</a>
|
||||
<a href="chapter_heap/">
|
||||
<img src="assets/hero/chapter_heap.png" alt="" style="height: 10.566%; left: 77.226%; top: 11.559%;">
|
||||
<span style="left: 88.103%; top: 15.422%;">Heaps</span>
|
||||
</a>
|
||||
<a href="chapter_graph/">
|
||||
<img src="assets/hero/chapter_graph.png" alt="" style="height: 16.112%; left: 51.854%; top: 5.575%;">
|
||||
<span style="left: 71.195%; top: 6.503%;">Graphs</span>
|
||||
</a>
|
||||
<a href="chapter_searching/">
|
||||
<img src="assets/hero/chapter_searching.png" alt="" style="height: 15.149%; left: 18.185%; top: 16.404%;">
|
||||
<span style="left: 14.556%; top: 20.876%;">Searching</span>
|
||||
</a>
|
||||
<a href="chapter_sorting/">
|
||||
<img src="assets/hero/chapter_sorting.png" alt="" style="height: 9.574%; left: 25.409%; top: 40.747%;">
|
||||
<span style="left: 28.805%; top: 53.808%;">Sorting</span>
|
||||
</a>
|
||||
<a href="chapter_divide_and_conquer/">
|
||||
<img src="assets/hero/chapter_divide_and_conquer.png" alt="" style="height: 18.681%; left: 32.721%; top: 4.816%;">
|
||||
<span style="left: 31.42%; top: 8.679%;">Divide and conquer</span>
|
||||
</a>
|
||||
<a href="chapter_backtracking/">
|
||||
<img src="assets/hero/chapter_backtracking.png" alt="" style="height: 17.338%; left: 4.875%; top: 32.925%;">
|
||||
<span style="left: 4.742%; top: 50.113%;">Backtracking</span>
|
||||
</a>
|
||||
<a href="chapter_dynamic_programming/">
|
||||
<img src="assets/hero/chapter_dynamic_programming.png" alt="" style="height: 15.47%; left: 9.406%; top: 57.472%;">
|
||||
<span style="left: 8.561%; top: 75.351%;">Dynamic programming</span>
|
||||
</a>
|
||||
<a href="chapter_greedy/">
|
||||
<img src="assets/hero/chapter_greedy.png" alt="" style="height: 14.127%; left: 23.132%; top: 75.803%;">
|
||||
<span style="left: 21.619%; top: 86.85%;">Greedy algorithms</span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- heading -->
|
||||
<div class="heading-div">
|
||||
<img style="height: min(9vh, 12vw);" src="https://readme-typing-svg.demolab.com/?font=Noto+Sans&weight=400&duration=3500&pause=2000&color=FFF¢er=true&vCenter=true&random=false&width=200&lines=Hello%2C+Algo+!" alt="" />
|
||||
<div style="pointer-events: auto;">
|
||||
<p style="margin-top: max(-1vh, -2vw); margin-bottom: min(2vh, 3.5vw);">
|
||||
A data structures and algorithms tutorial with animated illustrations and code you can run with one click
|
||||
</p>
|
||||
<a href="chapter_hello_algo/" class="rounded-button">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
|
||||
<path d="M160 96a96 96 0 1 1 192 0A96 96 0 1 1 160 96zm80 152V512l-48.4-24.2c-20.9-10.4-43.5-17-66.8-19.3l-96-9.6C12.5 457.2 0 443.5 0 427V224c0-17.7 14.3-32 32-32H62.3c63.6 0 125.6 19.6 177.7 56zm32 264V248c52.1-36.4 114.1-56 177.7-56H480c17.7 0 32 14.3 32 32V427c0 16.4-12.5 30.2-28.8 31.8l-96 9.6c-23.2 2.3-45.9 8.9-66.8 19.3L272 512z" />
|
||||
</svg>
|
||||
<span>Start reading</span>
|
||||
</a>
|
||||
<a href="https://github.com/krahets/hello-algo" class="rounded-button">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 496 512">
|
||||
<path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3 .3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5 .3-6.2 2.3zm44.2-1.7c-2.9 .7-4.9 2.6-4.6 4.9 .3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3 .7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3 .3 2.9 2.3 3.9 1.6 1 3.6 .7 4.3-.7 .7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3 .7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3 .7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z">
|
||||
</path>
|
||||
</svg>
|
||||
<span>GitHub</span>
|
||||
</a>
|
||||
</div>
|
||||
<!-- arrow -->
|
||||
<div style="text-align: center; margin-top: min(2.5vh, 3.5vw);">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="var(--md-default-fg-color)" height="2vh" viewBox="0 0 384 512">
|
||||
<path d="M169.4 470.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 370.8 224 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 306.7L54.6 265.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z" />
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Generated from the shared homepage template and locale configuration. -->
|
||||
<link href="../assets/home/ad8bb1cc4c28091c/hero-motion.css" rel="stylesheet"/>
|
||||
<noscript>
|
||||
<style>
|
||||
[data-home-src], video[data-home-poster] { display: none; }
|
||||
</style>
|
||||
</noscript>
|
||||
<section class="home-div home-universe-bg" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="starfield">
|
||||
<div class="starfield-origin">
|
||||
</div>
|
||||
</div>
|
||||
<div class="hero-div hero-div--en" data-home-layout="list">
|
||||
<img alt="" data-hero-asset="ground" data-source-height="380" data-source-width="881" height="380" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/567306c070a6a7e2/ground.webp" style="position: absolute; width: auto; height: 26.445%; left: 28.211%; top: 54.145%;" width="881"/>
|
||||
<img alt="" data-hero-asset="links" data-source-height="1134" data-source-width="1562" height="1134" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/3e50f38a325c1cb5/links.webp" style="position: absolute; width: auto; height: 78.751%; left: 10.545%; top: 7.326%;" width="1562"/>
|
||||
<a href="chapter_introduction/">
|
||||
<img alt="" data-hero-asset="astronaut" data-source-height="672" data-source-width="515" height="672" src="../assets/home/ad8bb1cc4c28091c/../shared/images/8e5eb3b3e3ebd9f7/astronaut.webp" style="height: 46.673%; left: 35.413%; top: 24.343%;" width="515"/>
|
||||
<span style="left: 52.244%; top: 20.919%;">
|
||||
Getting to know algorithms
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_computational_complexity/">
|
||||
<img alt="" data-hero-asset="chapter_computational_complexity" data-source-height="178" data-source-width="113" height="178" src="../assets/home/ad8bb1cc4c28091c/../shared/images/2fb425426d1f8d86/chapter_computational_complexity.webp" style="height: 12.347%; left: 36.267%; top: 37.653%;" width="113"/>
|
||||
<span style="left: 39.244%; top: 33.919%;">
|
||||
Complexity
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_array_and_linkedlist/">
|
||||
<img alt="" data-hero-asset="chapter_array_and_linkedlist" data-source-height="319" data-source-width="468" height="319" src="../assets/home/ad8bb1cc4c28091c/../shared/images/5cbbdf7be555d3ef/chapter_array_and_linkedlist.webp" style="height: 22.242%; left: 73.242%; top: 52.481%;" width="468"/>
|
||||
<span style="left: 90.897%; top: 76.259%;">
|
||||
Arrays and linked lists
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_stack_and_queue/">
|
||||
<img alt="" data-hero-asset="chapter_stack_and_queue" data-source-height="204" data-source-width="204" height="204" src="../assets/home/ad8bb1cc4c28091c/../shared/images/e2667767cf7481bd/chapter_stack_and_queue.webp" style="height: 14.302%; left: 62.646%; top: 77.875%;" width="204"/>
|
||||
<span style="left: 77.571%; top: 91.25%;">
|
||||
Stacks and queues
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_hashing/">
|
||||
<img alt="" data-hero-asset="chapter_hashing" data-source-height="218" data-source-width="218" height="218" src="../assets/home/ad8bb1cc4c28091c/../shared/images/b108d70a537714cb/chapter_hashing.webp" style="height: 15.266%; left: 63.281%; top: 27.933%;" width="218"/>
|
||||
<span style="left: 68.862%; top: 46.292%;">
|
||||
Hash tables
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_tree/">
|
||||
<img alt="" data-hero-asset="chapter_tree" data-source-height="281" data-source-width="280" height="281" src="../assets/home/ad8bb1cc4c28091c/../shared/images/8138bb0acecedec4/chapter_tree.webp" style="height: 19.615%; left: 80.137%; top: 26.678%;" width="280"/>
|
||||
<span style="left: 96.159%; top: 44.8%;">
|
||||
Trees
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_heap/">
|
||||
<img alt="" data-hero-asset="chapter_heap" data-source-height="152" data-source-width="151" height="152" src="../assets/home/ad8bb1cc4c28091c/../shared/images/7586281e6691807a/chapter_heap.webp" style="height: 10.566%; left: 77.226%; top: 11.559%;" width="151"/>
|
||||
<span style="left: 88.103%; top: 15.422%;">
|
||||
Heaps
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_graph/">
|
||||
<img alt="" data-hero-asset="chapter_graph" data-source-height="272" data-source-width="542" height="272" src="../assets/home/ad8bb1cc4c28091c/../shared/images/175a7f2e7c3cf5f0/chapter_graph.webp" style="height: 16.112%; left: 51.854%; top: 5.575%;" width="542"/>
|
||||
<span style="left: 71.195%; top: 6.503%;">
|
||||
Graphs
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_searching/">
|
||||
<img alt="" data-hero-asset="chapter_searching" data-source-height="216" data-source-width="216" height="216" src="../assets/home/ad8bb1cc4c28091c/../shared/images/ebfe2b953dbb9d90/chapter_searching.webp" style="height: 15.149%; left: 18.185%; top: 16.404%;" width="216"/>
|
||||
<span style="left: 14.556%; top: 20.876%;">
|
||||
Searching
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_sorting/">
|
||||
<img alt="" data-hero-asset="chapter_sorting" data-source-height="137" data-source-width="138" height="137" src="../assets/home/ad8bb1cc4c28091c/../shared/images/9d4be68b2680967c/chapter_sorting.webp" style="height: 9.574%; left: 25.409%; top: 40.747%;" width="138"/>
|
||||
<span style="left: 28.805%; top: 53.808%;">
|
||||
Sorting
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_divide_and_conquer/">
|
||||
<img alt="" data-hero-asset="chapter_divide_and_conquer" data-source-height="269" data-source-width="407" height="269" src="../assets/home/ad8bb1cc4c28091c/../shared/images/6f5766ca9385cd2e/chapter_divide_and_conquer.webp" style="height: 18.681%; left: 32.721%; top: 4.816%;" width="407"/>
|
||||
<span style="left: 31.42%; top: 8.679%;">
|
||||
Divide and conquer
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_backtracking/">
|
||||
<img alt="" data-hero-asset="chapter_backtracking" data-source-height="249" data-source-width="345" height="249" src="../assets/home/ad8bb1cc4c28091c/../shared/images/176675e685febf11/chapter_backtracking.webp" style="height: 17.338%; left: 4.875%; top: 32.925%;" width="345"/>
|
||||
<span style="left: 4.742%; top: 50.113%;">
|
||||
Backtracking
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_dynamic_programming/">
|
||||
<img alt="" data-hero-asset="chapter_dynamic_programming" data-source-height="268" data-source-width="267" height="268" src="../assets/home/ad8bb1cc4c28091c/../shared/images/06264b1ffd05b08e/chapter_dynamic_programming.webp" style="height: 15.47%; left: 9.406%; top: 57.472%;" width="267"/>
|
||||
<span style="left: 8.561%; top: 75.351%;">
|
||||
Dynamic programming
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_greedy/">
|
||||
<img alt="" data-hero-asset="chapter_greedy" data-source-height="202" data-source-width="265" height="202" src="../assets/home/ad8bb1cc4c28091c/../shared/images/2ce6caaac951c40b/chapter_greedy.webp" style="height: 14.127%; left: 23.132%; top: 75.803%;" width="265"/>
|
||||
<span style="left: 21.619%; top: 86.85%;">
|
||||
Greedy algorithms
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="heading-div">
|
||||
<img alt="" loading="lazy" src="https://readme-typing-svg.demolab.com/?font=Noto+Sans&weight=400&duration=3500&pause=2000&color=FFF&center=true&vCenter=true&random=false&width=200&lines=Hello%2C+Algo+!" style="height: min(9vh, 12vw);"/>
|
||||
<div style="pointer-events: auto;">
|
||||
<p style="margin-top: max(-1vh, -2vw); margin-bottom: min(2vh, 3.5vw);">
|
||||
A data structures and algorithms tutorial with animated illustrations and code you can run with one click
|
||||
</p>
|
||||
<a class="rounded-button" href="chapter_hello_algo/">
|
||||
<svg viewbox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
|
||||
<path d="M160 96a96 96 0 1 1 192 0A96 96 0 1 1 160 96zm80 152V512l-48.4-24.2c-20.9-10.4-43.5-17-66.8-19.3l-96-9.6C12.5 457.2 0 443.5 0 427V224c0-17.7 14.3-32 32-32H62.3c63.6 0 125.6 19.6 177.7 56zm32 264V248c52.1-36.4 114.1-56 177.7-56H480c17.7 0 32 14.3 32 32V427c0 16.4-12.5 30.2-28.8 31.8l-96 9.6c-23.2 2.3-45.9 8.9-66.8 19.3L272 512z">
|
||||
</path>
|
||||
</svg>
|
||||
<span>
|
||||
Start reading
|
||||
</span>
|
||||
</a>
|
||||
<a class="rounded-button" href="https://github.com/krahets/hello-algo">
|
||||
<svg viewbox="0 0 496 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3 .3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5 .3-6.2 2.3zm44.2-1.7c-2.9 .7-4.9 2.6-4.6 4.9 .3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3 .7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3 .3 2.9 2.3 3.9 1.6 1 3.6 .7 4.3-.7 .7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3 .7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3 .7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z">
|
||||
</path>
|
||||
</svg>
|
||||
<span>
|
||||
GitHub
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<div style="text-align: center; margin-top: min(2.5vh, 3.5vw);">
|
||||
<svg fill="var(--md-default-fg-color)" height="2vh" viewbox="0 0 384 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M169.4 470.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 370.8 224 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 306.7L54.6 265.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z">
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Section: reading -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content">
|
||||
<div class="reading-media">
|
||||
<!-- devices -->
|
||||
<!-- mac height = 248.1 mm -->
|
||||
<!-- ipad height = 280.6mm -->
|
||||
<!-- iphone height = 160.7mm -->
|
||||
<div class="media-block">
|
||||
<a href="chapter_hello_algo/">
|
||||
<div style="height: 4.34%;"></div>
|
||||
<img class="device-on-hover" style="height: 66.31%;" src="assets/hero/web_mac_iphone.png" alt="The English web edition">
|
||||
<div style="height: 4.34%;"></div>
|
||||
<div class="text-button">
|
||||
<span>Read online</span>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z" />
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="media-block">
|
||||
<a href="https://github.com/krahets/hello-algo/releases">
|
||||
<img class="device-on-hover" style="height: 75%;" src="assets/hero/pdf_ipad.png" alt="Cover of the published English PDF, version 1.3.0">
|
||||
<div class="text-button">
|
||||
<span>Download PDF/EPUB</span>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z" />
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<p style="margin-top: 2em;">Get started with data structures and algorithms through 500 animated illustrations, code in 14 programming languages, and 3,000 community questions and answers</p>
|
||||
</div>
|
||||
<section class="home-div" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="section-content">
|
||||
<div class="reading-media">
|
||||
<div class="media-block">
|
||||
<a href="chapter_hello_algo/">
|
||||
<div style="height: 4.34%;">
|
||||
</div>
|
||||
<img alt="Web reading on a computer and phone" class="device-on-hover" data-home-src="../assets/home/ad8bb1cc4c28091c/../shared/images/5b64cf7672ec5ec6/web_mac_iphone.webp" decoding="async" height="965" style="height: 66.31%;" width="1598"/>
|
||||
<noscript>
|
||||
<img alt="Web reading on a computer and phone" class="device-on-hover" height="965" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/5b64cf7672ec5ec6/web_mac_iphone.webp" style="height: 66.31%;" width="1598"/>
|
||||
</noscript>
|
||||
<div style="height: 4.34%;">
|
||||
</div>
|
||||
<div class="text-button">
|
||||
<span>
|
||||
Read online
|
||||
</span>
|
||||
<svg viewbox="0 0 320 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z">
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="media-block">
|
||||
<a href="https://github.com/krahets/hello-algo/releases">
|
||||
<img alt="PDF reading on a tablet" class="device-on-hover" data-home-src="../assets/home/ad8bb1cc4c28091c/../shared/images/66baa2f9bf3abec7/pdf_ipad.webp" decoding="async" height="960" style="height: 75%;" width="812"/>
|
||||
<noscript>
|
||||
<img alt="PDF reading on a tablet" class="device-on-hover" height="960" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/66baa2f9bf3abec7/pdf_ipad.webp" style="height: 75%;" width="812"/>
|
||||
</noscript>
|
||||
<div class="text-button">
|
||||
<span>
|
||||
Download PDF/EPUB
|
||||
</span>
|
||||
<svg viewbox="0 0 320 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z">
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<p style="margin-top: 2em;">
|
||||
Get started with data structures and algorithms through 500 animated illustrations, code in 14 programming languages, and 3,000 community questions and answers
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Section: endorsements -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content">
|
||||
<h3 style="text-align: center; margin: 1em auto;">Endorsements</h3>
|
||||
<div class="intro-container endor-container">
|
||||
<div class="intro-text endor-text">
|
||||
<p style="margin-bottom: 0;">“An accessible introduction to data structures and algorithms that encourages readers to learn by thinking and doing. Highly recommended for anyone new to algorithms.”</p>
|
||||
<p style="font-weight: bold;">— Junhui Deng, Professor, Department of Computer Science, Tsinghua University</p>
|
||||
</div>
|
||||
<div class="intro-text endor-text">
|
||||
<p style="margin-bottom: 0;">“If I had had Hello Algo when I was learning data structures and algorithms, it would have been ten times easier!”</p>
|
||||
<p style="font-weight: bold;">— Mu Li, Senior Principal Scientist, Amazon</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<section class="home-div" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="section-content">
|
||||
<h3 style="text-align: center; margin: 1em auto;">
|
||||
Endorsements
|
||||
</h3>
|
||||
<div class="intro-container endor-container">
|
||||
<div class="intro-text endor-text">
|
||||
<p style="margin-bottom: 0;">
|
||||
“An accessible introduction to data structures and algorithms that encourages readers to learn by thinking and doing. Highly recommended for anyone new to algorithms.”
|
||||
</p>
|
||||
<p style="font-weight: bold;">
|
||||
— Junhui Deng, Professor, Department of Computer Science, Tsinghua University
|
||||
</p>
|
||||
</div>
|
||||
<div class="intro-text endor-text">
|
||||
<p style="margin-bottom: 0;">
|
||||
“If I had had Hello Algo when I was learning data structures and algorithms, it would have been ten times easier!”
|
||||
</p>
|
||||
<p style="font-weight: bold;">
|
||||
— Mu Li, Senior Principal Scientist, Amazon
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Section: features -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content">
|
||||
<div class="intro-container">
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="1.5em" width="1.5em" viewBox="0 0 640 512">
|
||||
<path fill="var(--md-primary-bg-color)" d="M256 0H576c35.3 0 64 28.7 64 64V288c0 35.3-28.7 64-64 64H256c-35.3 0-64-28.7-64-64V64c0-35.3 28.7-64 64-64zM476 106.7C471.5 100 464 96 456 96s-15.5 4-20 10.7l-56 84L362.7 169c-4.6-5.7-11.5-9-18.7-9s-14.2 3.3-18.7 9l-64 80c-5.8 7.2-6.9 17.1-2.9 25.4s12.4 13.6 21.6 13.6h80 48H552c8.9 0 17-4.9 21.2-12.7s3.7-17.3-1.2-24.6l-96-144zM336 96a32 32 0 1 0 -64 0 32 32 0 1 0 64 0zM64 128h96V384v32c0 17.7 14.3 32 32 32H320c17.7 0 32-14.3 32-32V384H512v64c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V192c0-35.3 28.7-64 64-64zm8 64c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V208c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V312c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H72zm336 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H424c-8.8 0-16 7.2-16 16z" />
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">Animated illustrations</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">Clear explanations and a gradual learning curve</p>
|
||||
<p class="intro-quote">"A picture is worth a thousand words."</p>
|
||||
</div>
|
||||
</div>
|
||||
<video class="intro-image" src="index.assets/animation.mp4" autoplay loop muted playsinline aria-label="Animation example"></video>
|
||||
</div>
|
||||
|
||||
<div class="intro-container">
|
||||
<video class="intro-image" src="index.assets/running_code.mp4" autoplay loop muted playsinline aria-label="Running code example"></video>
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="1.5em" width="1.5em" viewBox="0 0 640 512">
|
||||
<path fill="var(--md-primary-bg-color)" d="M392.8 1.2c-17-4.9-34.7 5-39.6 22l-128 448c-4.9 17 5 34.7 22 39.6s34.7-5 39.6-22l128-448c4.9-17-5-34.7-22-39.6zm80.6 120.1c-12.5 12.5-12.5 32.8 0 45.3L562.7 256l-89.4 89.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l112-112c12.5-12.5 12.5-32.8 0-45.3l-112-112c-12.5-12.5-32.8-12.5-45.3 0zm-306.7 0c-12.5-12.5-32.8-12.5-45.3 0l-112 112c-12.5 12.5-12.5 32.8 0 45.3l112 112c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256l89.4-89.4c12.5-12.5 12.5-32.8 0-45.3z" />
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">Run code with one click</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">Code in more than ten programming languages, with execution visualizations</p>
|
||||
<p class="intro-quote">"Talk is cheap. Show me the code."</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="intro-container">
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="1.5em" width="1.5em" viewBox="0 0 640 512">
|
||||
<path fill="var(--md-primary-bg-color)" d="M88.2 309.1c9.8-18.3 6.8-40.8-7.5-55.8C59.4 230.9 48 204 48 176c0-63.5 63.8-128 160-128s160 64.5 160 128s-63.8 128-160 128c-13.1 0-25.8-1.3-37.8-3.6c-10.4-2-21.2-.6-30.7 4.2c-4.1 2.1-8.3 4.1-12.6 6c-16 7.2-32.9 13.5-49.9 18c2.8-4.6 5.4-9.1 7.9-13.6c1.1-1.9 2.2-3.9 3.2-5.9zM0 176c0 41.8 17.2 80.1 45.9 110.3c-.9 1.7-1.9 3.5-2.8 5.1c-10.3 18.4-22.3 36.5-36.6 52.1c-6.6 7-8.3 17.2-4.6 25.9C5.8 378.3 14.4 384 24 384c43 0 86.5-13.3 122.7-29.7c4.8-2.2 9.6-4.5 14.2-6.8c15.1 3 30.9 4.5 47.1 4.5c114.9 0 208-78.8 208-176S322.9 0 208 0S0 78.8 0 176zM432 480c16.2 0 31.9-1.6 47.1-4.5c4.6 2.3 9.4 4.6 14.2 6.8C529.5 498.7 573 512 616 512c9.6 0 18.2-5.7 22-14.5c3.8-8.8 2-19-4.6-25.9c-14.2-15.6-26.2-33.7-36.6-52.1c-.9-1.7-1.9-3.4-2.8-5.1C622.8 384.1 640 345.8 640 304c0-94.4-87.9-171.5-198.2-175.8c4.1 15.2 6.2 31.2 6.2 47.8l0 .6c87.2 6.7 144 67.5 144 127.4c0 28-11.4 54.9-32.7 77.2c-14.3 15-17.3 37.6-7.5 55.8c1.1 2 2.2 4 3.2 5.9c2.5 4.5 5.2 9 7.9 13.6c-17-4.5-33.9-10.7-49.9-18c-4.3-1.9-8.5-3.9-12.6-6c-9.5-4.8-20.3-6.2-30.7-4.2c-12.1 2.4-24.7 3.6-37.8 3.6c-61.7 0-110-26.5-136.8-62.3c-16 5.4-32.8 9.4-50 11.8C279 439.8 350 480 432 480z" />
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">Learn together</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">Ask questions, join discussions, and learn with fellow readers</p>
|
||||
<p class="intro-quote">"Learning by teaching."</p>
|
||||
</div>
|
||||
</div>
|
||||
<video class="intro-image" src="index.assets/comment.mp4" autoplay loop muted playsinline aria-label="Comments example"></video>
|
||||
</div>
|
||||
|
||||
<section class="home-div" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="section-content">
|
||||
<div class="intro-container">
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg height="1.5em" viewbox="0 0 640 512" width="1.5em" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M256 0H576c35.3 0 64 28.7 64 64V288c0 35.3-28.7 64-64 64H256c-35.3 0-64-28.7-64-64V64c0-35.3 28.7-64 64-64zM476 106.7C471.5 100 464 96 456 96s-15.5 4-20 10.7l-56 84L362.7 169c-4.6-5.7-11.5-9-18.7-9s-14.2 3.3-18.7 9l-64 80c-5.8 7.2-6.9 17.1-2.9 25.4s12.4 13.6 21.6 13.6h80 48H552c8.9 0 17-4.9 21.2-12.7s3.7-17.3-1.2-24.6l-96-144zM336 96a32 32 0 1 0 -64 0 32 32 0 1 0 64 0zM64 128h96V384v32c0 17.7 14.3 32 32 32H320c17.7 0 32-14.3 32-32V384H512v64c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V192c0-35.3 28.7-64 64-64zm8 64c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V208c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V312c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H72zm336 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H424c-8.8 0-16 7.2-16 16z" fill="var(--md-primary-bg-color)">
|
||||
</path>
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">
|
||||
Animated illustrations
|
||||
</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">
|
||||
Clear explanations and a gradual learning curve
|
||||
</p>
|
||||
<p class="intro-quote">
|
||||
"A picture is worth a thousand words."
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Section: contributors -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content" style="max-width: 90vw;">
|
||||
<!-- author -->
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>Author</h3>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/krahets">
|
||||
<img class="profile-img" src="assets/avatar/avatar_yudongjin.jpg" alt="Author: yudongjin" />
|
||||
<br><b>Yudong Jin (@krahets)</b>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- code reviewers -->
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>Code reviewers</h3>
|
||||
<p>The developers below worked together on the code in different programming languages. Thank you for your efforts and contributions!</p>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/coderonion">
|
||||
<img class="profile-img" src="assets/avatar/avatar_coderonion.jpg" alt="Reviewer: coderonion" />
|
||||
<br><b>coderonion</b>
|
||||
<br><sub>Zig, Rust</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/curtishd">
|
||||
<img class="profile-img" src="assets/avatar/avatar_curtishd.jpg" alt="Reviewer: curtishd" />
|
||||
<br><b>curtishd</b>
|
||||
<br><sub>Kotlin</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/Gonglja">
|
||||
<img class="profile-img" src="assets/avatar/avatar_Gonglja.jpg" alt="Reviewer: Gonglja" />
|
||||
<br><b>Gonglja</b>
|
||||
<br><sub>C, C++</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/gvenusleo">
|
||||
<img class="profile-img" src="assets/avatar/avatar_gvenusleo.jpg" alt="Reviewer: gvenusleo" />
|
||||
<br><b>gvenusleo</b>
|
||||
<br><sub>Dart</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/hpstory">
|
||||
<img class="profile-img" src="assets/avatar/avatar_hpstory.jpg" alt="Reviewer: hpstory" />
|
||||
<br><b>hpstory</b>
|
||||
<br><sub>C#</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/justin-tse">
|
||||
<img class="profile-img" src="assets/avatar/avatar_justin-tse.jpg" alt="Reviewer: justin-tse" />
|
||||
<br><b>justin-tse</b>
|
||||
<br><sub>JS, TS</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/khoaxuantu">
|
||||
<img class="profile-img" src="assets/avatar/avatar_khoaxuantu.jpg" alt="Reviewer: khoaxuantu" />
|
||||
<br><b>khoaxuantu</b>
|
||||
<br><sub>Ruby</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/krahets">
|
||||
<img class="profile-img" src="assets/avatar/avatar_krahets.jpg" alt="Reviewer: krahets" />
|
||||
<br><b>krahets</b>
|
||||
<br><sub>Python, Java</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/night-cruise">
|
||||
<img class="profile-img" src="assets/avatar/avatar_night-cruise.jpg" alt="Reviewer: night-cruise" />
|
||||
<br><b>night-cruise</b>
|
||||
<br><sub>Rust</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/nuomi1">
|
||||
<img class="profile-img" src="assets/avatar/avatar_nuomi1.jpg" alt="Reviewer: nuomi1" />
|
||||
<br><b>nuomi1</b>
|
||||
<br><sub>Swift</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/Reanon">
|
||||
<img class="profile-img" src="assets/avatar/avatar_Reanon.jpg" alt="Reviewer: Reanon" />
|
||||
<br><b>Reanon</b>
|
||||
<br><sub>Go, C</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/rongyi">
|
||||
<img class="profile-img" src="assets/avatar/avatar_rongyi.jpg" alt="Reviewer: rongyi" />
|
||||
<br><b>rongyi</b>
|
||||
<br><sub>Rust</sub>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- contributors -->
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>Contributors</h3>
|
||||
<p>More than 200 open-source contributors have helped improve this book. Thank you for your time and effort!</p>
|
||||
<a href="https://github.com/krahets/hello-algo/graphs/contributors">
|
||||
<img src="https://contrib.rocks/image?repo=krahets/hello-algo&max=300&columns=12" alt="Contributors" style="width: 100%; max-width: 38.5em;">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<video aria-label="Animation example" class="intro-image" data-home-poster="../assets/home/ad8bb1cc4c28091c/../shared/images/325eedad7e336423/en_animation-poster.webp" data-home-video="../assets/home/ad8bb1cc4c28091c/../shared/media/99db238804bedf45/en_animation.mp4" height="864" loop="" muted="" playsinline="" preload="none" style="aspect-ratio: 1280 / 864" width="1280">
|
||||
</video>
|
||||
<noscript>
|
||||
<a href="../assets/home/ad8bb1cc4c28091c/../shared/media/99db238804bedf45/en_animation.mp4">
|
||||
<img alt="Animation example" class="intro-image" height="864" src="../assets/home/ad8bb1cc4c28091c/../shared/images/325eedad7e336423/en_animation-poster.webp" width="1280"/>
|
||||
Animated illustrations
|
||||
</a>
|
||||
</noscript>
|
||||
</div>
|
||||
<div class="intro-container">
|
||||
<video aria-label="Running code example" class="intro-image" data-home-poster="../assets/home/ad8bb1cc4c28091c/../shared/images/615e2bcba0901fda/en_running_code-poster.webp" data-home-video="../assets/home/ad8bb1cc4c28091c/../shared/media/8a8d9283cb37b664/en_running_code.mp4" height="864" loop="" muted="" playsinline="" preload="none" style="aspect-ratio: 1280 / 864" width="1280">
|
||||
</video>
|
||||
<noscript>
|
||||
<a href="../assets/home/ad8bb1cc4c28091c/../shared/media/8a8d9283cb37b664/en_running_code.mp4">
|
||||
<img alt="Running code example" class="intro-image" height="864" src="../assets/home/ad8bb1cc4c28091c/../shared/images/615e2bcba0901fda/en_running_code-poster.webp" width="1280"/>
|
||||
Run code with one click
|
||||
</a>
|
||||
</noscript>
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg height="1.5em" viewbox="0 0 640 512" width="1.5em" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M392.8 1.2c-17-4.9-34.7 5-39.6 22l-128 448c-4.9 17 5 34.7 22 39.6s34.7-5 39.6-22l128-448c4.9-17-5-34.7-22-39.6zm80.6 120.1c-12.5 12.5-12.5 32.8 0 45.3L562.7 256l-89.4 89.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l112-112c12.5-12.5 12.5-32.8 0-45.3l-112-112c-12.5-12.5-32.8-12.5-45.3 0zm-306.7 0c-12.5-12.5-32.8-12.5-45.3 0l-112 112c-12.5 12.5-12.5 32.8 0 45.3l112 112c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256l89.4-89.4c12.5-12.5 12.5-32.8 0-45.3z" fill="var(--md-primary-bg-color)">
|
||||
</path>
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">
|
||||
Run code with one click
|
||||
</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">
|
||||
Code in more than ten programming languages, with execution visualizations
|
||||
</p>
|
||||
<p class="intro-quote">
|
||||
"Talk is cheap. Show me the code."
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="intro-container">
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg height="1.5em" viewbox="0 0 640 512" width="1.5em" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M88.2 309.1c9.8-18.3 6.8-40.8-7.5-55.8C59.4 230.9 48 204 48 176c0-63.5 63.8-128 160-128s160 64.5 160 128s-63.8 128-160 128c-13.1 0-25.8-1.3-37.8-3.6c-10.4-2-21.2-.6-30.7 4.2c-4.1 2.1-8.3 4.1-12.6 6c-16 7.2-32.9 13.5-49.9 18c2.8-4.6 5.4-9.1 7.9-13.6c1.1-1.9 2.2-3.9 3.2-5.9zM0 176c0 41.8 17.2 80.1 45.9 110.3c-.9 1.7-1.9 3.5-2.8 5.1c-10.3 18.4-22.3 36.5-36.6 52.1c-6.6 7-8.3 17.2-4.6 25.9C5.8 378.3 14.4 384 24 384c43 0 86.5-13.3 122.7-29.7c4.8-2.2 9.6-4.5 14.2-6.8c15.1 3 30.9 4.5 47.1 4.5c114.9 0 208-78.8 208-176S322.9 0 208 0S0 78.8 0 176zM432 480c16.2 0 31.9-1.6 47.1-4.5c4.6 2.3 9.4 4.6 14.2 6.8C529.5 498.7 573 512 616 512c9.6 0 18.2-5.7 22-14.5c3.8-8.8 2-19-4.6-25.9c-14.2-15.6-26.2-33.7-36.6-52.1c-.9-1.7-1.9-3.4-2.8-5.1C622.8 384.1 640 345.8 640 304c0-94.4-87.9-171.5-198.2-175.8c4.1 15.2 6.2 31.2 6.2 47.8l0 .6c87.2 6.7 144 67.5 144 127.4c0 28-11.4 54.9-32.7 77.2c-14.3 15-17.3 37.6-7.5 55.8c1.1 2 2.2 4 3.2 5.9c2.5 4.5 5.2 9 7.9 13.6c-17-4.5-33.9-10.7-49.9-18c-4.3-1.9-8.5-3.9-12.6-6c-9.5-4.8-20.3-6.2-30.7-4.2c-12.1 2.4-24.7 3.6-37.8 3.6c-61.7 0-110-26.5-136.8-62.3c-16 5.4-32.8 9.4-50 11.8C279 439.8 350 480 432 480z" fill="var(--md-primary-bg-color)">
|
||||
</path>
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">
|
||||
Learn together
|
||||
</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">
|
||||
Ask questions, join discussions, and learn with fellow readers
|
||||
</p>
|
||||
<p class="intro-quote">
|
||||
"Learning by teaching."
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<video aria-label="Comments example" class="intro-image" data-home-poster="../assets/home/ad8bb1cc4c28091c/../shared/images/ef67d25d9c7ff1b5/en_comment-poster.webp" data-home-video="../assets/home/ad8bb1cc4c28091c/../shared/media/ea699aff8bc08558/en_comment.mp4" height="864" loop="" muted="" playsinline="" preload="none" style="aspect-ratio: 1280 / 864" width="1280">
|
||||
</video>
|
||||
<noscript>
|
||||
<a href="../assets/home/ad8bb1cc4c28091c/../shared/media/ea699aff8bc08558/en_comment.mp4">
|
||||
<img alt="Comments example" class="intro-image" height="864" src="../assets/home/ad8bb1cc4c28091c/../shared/images/ef67d25d9c7ff1b5/en_comment-poster.webp" width="1280"/>
|
||||
Learn together
|
||||
</a>
|
||||
</noscript>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="home-div" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="section-content" style="max-width: 90vw;">
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>
|
||||
Author
|
||||
</h3>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/krahets">
|
||||
<img alt="Author: yudongjin" class="profile-img" height="512" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/02348410d40f7665/avatar_yudongjin.webp" width="512"/>
|
||||
<br/>
|
||||
<b>
|
||||
Yudong Jin (@krahets)
|
||||
</b>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>
|
||||
Code reviewers
|
||||
</h3>
|
||||
<p>
|
||||
The developers below worked together on the code in different programming languages. Thank you for your efforts and contributions!
|
||||
</p>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/coderonion">
|
||||
<img alt="Reviewer: coderonion" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/db606f27971eae34/avatar_coderonion.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
coderonion
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Zig, Rust
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/curtishd">
|
||||
<img alt="Reviewer: curtishd" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/feedb0e547ea31fc/avatar_curtishd.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
curtishd
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Kotlin
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/Gonglja">
|
||||
<img alt="Reviewer: Gonglja" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/cdcf023b032b8d30/avatar_Gonglja.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
Gonglja
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
C, C++
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/gvenusleo">
|
||||
<img alt="Reviewer: gvenusleo" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/464e2d351b9263ec/avatar_gvenusleo.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
gvenusleo
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Dart
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/hpstory">
|
||||
<img alt="Reviewer: hpstory" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/7b6478acdab6b845/avatar_hpstory.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
hpstory
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
C#
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/justin-tse">
|
||||
<img alt="Reviewer: justin-tse" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/208ee5aae490eefa/avatar_justin-tse.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
justin-tse
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
JS, TS
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/khoaxuantu">
|
||||
<img alt="Reviewer: khoaxuantu" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/9d3f1a21ff51de78/avatar_khoaxuantu.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
khoaxuantu
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Ruby
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/krahets">
|
||||
<img alt="Reviewer: krahets" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/e321f9a3ac2739e0/avatar_krahets.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
krahets
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Python, Java
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/night-cruise">
|
||||
<img alt="Reviewer: night-cruise" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/960b489efa22abd4/avatar_night-cruise.jpg" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
night-cruise
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Rust
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/nuomi1">
|
||||
<img alt="Reviewer: nuomi1" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/7316a9eb4429b259/avatar_nuomi1.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
nuomi1
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Swift
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/Reanon">
|
||||
<img alt="Reviewer: Reanon" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/dcc15aa68cc793c7/avatar_Reanon.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
Reanon
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Go, C
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/rongyi">
|
||||
<img alt="Reviewer: rongyi" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/5dc6c4b1d8bfe0ac/avatar_rongyi.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
rongyi
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Rust
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>
|
||||
Contributors
|
||||
</h3>
|
||||
<p>
|
||||
More than 200 open-source contributors have helped improve this book. Thank you for your time and effort!
|
||||
</p>
|
||||
<a href="https://github.com/krahets/hello-algo/graphs/contributors">
|
||||
<img alt="Contributors" loading="lazy" src="https://contrib.rocks/image?repo=krahets/hello-algo&max=300&columns=12" style="width: 100%; max-width: 38.5em;"/>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<!-- This independent fallback also works when the deferred loader cannot be fetched. -->
|
||||
<script defer="" onerror="document.querySelectorAll('[data-home-src], [data-home-poster]').forEach(function(el) { if (el.dataset.homeSrc) el.src = el.dataset.homeSrc; if (el.dataset.homePoster) el.poster = el.dataset.homePoster; });" src="../assets/home/ad8bb1cc4c28091c/javascripts/homepage-media.js">
|
||||
</script>
|
||||
|
||||
BIN
ja/docs/assets/hero/astronaut.webp
Normal file
BIN
ja/docs/assets/hero/astronaut.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 274 KiB |
BIN
ja/docs/assets/hero/ground.webp
Normal file
BIN
ja/docs/assets/hero/ground.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 276 KiB |
@@ -1,326 +1,506 @@
|
||||
<!-- Section: hero -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div" style="height: min(100vh, 120vw); position: relative; margin-top:-2.4rem; padding: 0; overflow: hidden;">
|
||||
<!-- hero image -->
|
||||
<!-- <img alt="" class="hero-bg" src="assets/hero/universe_bg.png" /> -->
|
||||
<div class="starfield">
|
||||
<div class="starfield-origin"></div>
|
||||
</div>
|
||||
<div class="hero-div hero-div--ja">
|
||||
<img src="assets/hero/ground.png" alt="" style="position: absolute; width: auto; height: 26.445%; left: 28.211%; top: 54.145%;">
|
||||
<img src="assets/hero/links.png" alt="" style="position: absolute; width: auto; height: 78.751%; left: 10.545%; top: 7.326%;">
|
||||
<a href="chapter_introduction/">
|
||||
<img src="assets/hero/astronaut.png" alt="" style="height: 46.673%; left: 35.413%; top: 24.343%;">
|
||||
<span style="left: 52.244%; top: 20.919%;">アルゴリズム入門</span>
|
||||
</a>
|
||||
<a href="chapter_computational_complexity/">
|
||||
<img src="assets/hero/chapter_computational_complexity.png" alt="" style="height: 12.347%; left: 36.267%; top: 37.653%;">
|
||||
<span style="left: 39.244%; top: 33.919%;">計算量</span>
|
||||
</a>
|
||||
<a href="chapter_array_and_linkedlist/">
|
||||
<img src="assets/hero/chapter_array_and_linkedlist.png" alt="" style="height: 22.242%; left: 73.242%; top: 52.481%;">
|
||||
<span style="left: 90.897%; top: 76.259%;">配列と連結リスト</span>
|
||||
</a>
|
||||
<a href="chapter_stack_and_queue/">
|
||||
<img src="assets/hero/chapter_stack_and_queue.png" alt="" style="height: 14.302%; left: 62.646%; top: 77.875%;">
|
||||
<span style="left: 77.571%; top: 91.25%;">スタックとキュー</span>
|
||||
</a>
|
||||
<a href="chapter_hashing/">
|
||||
<img src="assets/hero/chapter_hashing.png" alt="" style="height: 15.266%; left: 63.281%; top: 27.933%;">
|
||||
<span style="left: 68.862%; top: 46.292%;">ハッシュテーブル</span>
|
||||
</a>
|
||||
<a href="chapter_tree/">
|
||||
<img src="assets/hero/chapter_tree.png" alt="" style="height: 19.615%; left: 80.137%; top: 26.678%;">
|
||||
<span style="left: 96.159%; top: 44.8%;">木</span>
|
||||
</a>
|
||||
<a href="chapter_heap/">
|
||||
<img src="assets/hero/chapter_heap.png" alt="" style="height: 10.566%; left: 77.226%; top: 11.559%;">
|
||||
<span style="left: 88.103%; top: 15.422%;">ヒープ</span>
|
||||
</a>
|
||||
<a href="chapter_graph/">
|
||||
<img src="assets/hero/chapter_graph.png" alt="" style="height: 16.112%; left: 51.854%; top: 5.575%;">
|
||||
<span style="left: 71.195%; top: 6.503%;">グラフ</span>
|
||||
</a>
|
||||
<a href="chapter_searching/">
|
||||
<img src="assets/hero/chapter_searching.png" alt="" style="height: 15.149%; left: 18.185%; top: 16.404%;">
|
||||
<span style="left: 14.556%; top: 20.876%;">探索</span>
|
||||
</a>
|
||||
<a href="chapter_sorting/">
|
||||
<img src="assets/hero/chapter_sorting.png" alt="" style="height: 9.574%; left: 25.409%; top: 40.747%;">
|
||||
<span style="left: 28.805%; top: 53.808%;">ソート</span>
|
||||
</a>
|
||||
<a href="chapter_divide_and_conquer/">
|
||||
<img src="assets/hero/chapter_divide_and_conquer.png" alt="" style="height: 18.681%; left: 32.721%; top: 4.816%;">
|
||||
<span style="left: 31.42%; top: 8.679%;">分割統治</span>
|
||||
</a>
|
||||
<a href="chapter_backtracking/">
|
||||
<img src="assets/hero/chapter_backtracking.png" alt="" style="height: 17.338%; left: 4.875%; top: 32.925%;">
|
||||
<span style="left: 4.742%; top: 50.113%;">バックトラッキング</span>
|
||||
</a>
|
||||
<a href="chapter_dynamic_programming/">
|
||||
<img src="assets/hero/chapter_dynamic_programming.png" alt="" style="height: 15.47%; left: 9.406%; top: 57.472%;">
|
||||
<span style="left: 8.561%; top: 75.351%;">動的計画法</span>
|
||||
</a>
|
||||
<a href="chapter_greedy/">
|
||||
<img src="assets/hero/chapter_greedy.png" alt="" style="height: 14.127%; left: 23.132%; top: 75.803%;">
|
||||
<span style="left: 21.619%; top: 86.85%;">貪欲法</span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- heading -->
|
||||
<div class="heading-div">
|
||||
<img style="height: min(9vh, 12vw);" src="https://readme-typing-svg.demolab.com/?font=Noto+Sans+JP&weight=400&duration=3500&pause=2000&color=FFF¢er=true&vCenter=true&random=false&width=200&lines=Hello%2C+Algo+!" alt="" />
|
||||
<div style="pointer-events: auto;">
|
||||
<p style="margin-top: max(-1vh, -2vw); margin-bottom: min(2vh, 3.5vw);">
|
||||
アニメーションによる図解とワンクリックで実行できるコードで学ぶ、データ構造とアルゴリズムの入門書
|
||||
</p>
|
||||
<a href="chapter_hello_algo/" class="rounded-button">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
|
||||
<path d="M160 96a96 96 0 1 1 192 0A96 96 0 1 1 160 96zm80 152V512l-48.4-24.2c-20.9-10.4-43.5-17-66.8-19.3l-96-9.6C12.5 457.2 0 443.5 0 427V224c0-17.7 14.3-32 32-32H62.3c63.6 0 125.6 19.6 177.7 56zm32 264V248c52.1-36.4 114.1-56 177.7-56H480c17.7 0 32 14.3 32 32V427c0 16.4-12.5 30.2-28.8 31.8l-96 9.6c-23.2 2.3-45.9 8.9-66.8 19.3L272 512z" />
|
||||
</svg>
|
||||
<span>読み始める</span>
|
||||
</a>
|
||||
<a href="https://github.com/krahets/hello-algo" class="rounded-button">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 496 512">
|
||||
<path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3 .3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5 .3-6.2 2.3zm44.2-1.7c-2.9 .7-4.9 2.6-4.6 4.9 .3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3 .7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3 .3 2.9 2.3 3.9 1.6 1 3.6 .7 4.3-.7 .7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3 .7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3 .7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z">
|
||||
</path>
|
||||
</svg>
|
||||
<span>GitHub</span>
|
||||
</a>
|
||||
</div>
|
||||
<!-- arrow -->
|
||||
<div style="text-align: center; margin-top: min(2.5vh, 3.5vw);">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="var(--md-default-fg-color)" height="2vh" viewBox="0 0 384 512">
|
||||
<path d="M169.4 470.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 370.8 224 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 306.7L54.6 265.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z" />
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Generated from the shared homepage template and locale configuration. -->
|
||||
<link href="../assets/home/ad8bb1cc4c28091c/hero-motion.css" rel="stylesheet"/>
|
||||
<noscript>
|
||||
<style>
|
||||
[data-home-src], video[data-home-poster] { display: none; }
|
||||
</style>
|
||||
</noscript>
|
||||
<section class="home-div home-universe-bg" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="starfield">
|
||||
<div class="starfield-origin">
|
||||
</div>
|
||||
</div>
|
||||
<div class="hero-div hero-div--ja" data-home-layout="list">
|
||||
<img alt="" data-hero-asset="ground" data-source-height="380" data-source-width="881" height="380" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/567306c070a6a7e2/ground.webp" style="position: absolute; width: auto; height: 26.445%; left: 28.211%; top: 54.145%;" width="881"/>
|
||||
<img alt="" data-hero-asset="links" data-source-height="1134" data-source-width="1562" height="1134" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/3e50f38a325c1cb5/links.webp" style="position: absolute; width: auto; height: 78.751%; left: 10.545%; top: 7.326%;" width="1562"/>
|
||||
<a href="chapter_introduction/">
|
||||
<img alt="" data-hero-asset="astronaut" data-source-height="672" data-source-width="515" height="672" src="../assets/home/ad8bb1cc4c28091c/../shared/images/8e5eb3b3e3ebd9f7/astronaut.webp" style="height: 46.673%; left: 35.413%; top: 24.343%;" width="515"/>
|
||||
<span style="left: 52.244%; top: 20.919%;">
|
||||
アルゴリズム入門
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_computational_complexity/">
|
||||
<img alt="" data-hero-asset="chapter_computational_complexity" data-source-height="178" data-source-width="113" height="178" src="../assets/home/ad8bb1cc4c28091c/../shared/images/2fb425426d1f8d86/chapter_computational_complexity.webp" style="height: 12.347%; left: 36.267%; top: 37.653%;" width="113"/>
|
||||
<span style="left: 39.244%; top: 33.919%;">
|
||||
計算量
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_array_and_linkedlist/">
|
||||
<img alt="" data-hero-asset="chapter_array_and_linkedlist" data-source-height="319" data-source-width="468" height="319" src="../assets/home/ad8bb1cc4c28091c/../shared/images/5cbbdf7be555d3ef/chapter_array_and_linkedlist.webp" style="height: 22.242%; left: 73.242%; top: 52.481%;" width="468"/>
|
||||
<span style="left: 90.897%; top: 76.259%;">
|
||||
配列と連結リスト
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_stack_and_queue/">
|
||||
<img alt="" data-hero-asset="chapter_stack_and_queue" data-source-height="204" data-source-width="204" height="204" src="../assets/home/ad8bb1cc4c28091c/../shared/images/e2667767cf7481bd/chapter_stack_and_queue.webp" style="height: 14.302%; left: 62.646%; top: 77.875%;" width="204"/>
|
||||
<span style="left: 77.571%; top: 91.25%;">
|
||||
スタックとキュー
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_hashing/">
|
||||
<img alt="" data-hero-asset="chapter_hashing" data-source-height="218" data-source-width="218" height="218" src="../assets/home/ad8bb1cc4c28091c/../shared/images/b108d70a537714cb/chapter_hashing.webp" style="height: 15.266%; left: 63.281%; top: 27.933%;" width="218"/>
|
||||
<span style="left: 68.862%; top: 46.292%;">
|
||||
ハッシュテーブル
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_tree/">
|
||||
<img alt="" data-hero-asset="chapter_tree" data-source-height="281" data-source-width="280" height="281" src="../assets/home/ad8bb1cc4c28091c/../shared/images/8138bb0acecedec4/chapter_tree.webp" style="height: 19.615%; left: 80.137%; top: 26.678%;" width="280"/>
|
||||
<span style="left: 96.159%; top: 44.8%;">
|
||||
木
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_heap/">
|
||||
<img alt="" data-hero-asset="chapter_heap" data-source-height="152" data-source-width="151" height="152" src="../assets/home/ad8bb1cc4c28091c/../shared/images/7586281e6691807a/chapter_heap.webp" style="height: 10.566%; left: 77.226%; top: 11.559%;" width="151"/>
|
||||
<span style="left: 88.103%; top: 15.422%;">
|
||||
ヒープ
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_graph/">
|
||||
<img alt="" data-hero-asset="chapter_graph" data-source-height="272" data-source-width="542" height="272" src="../assets/home/ad8bb1cc4c28091c/../shared/images/175a7f2e7c3cf5f0/chapter_graph.webp" style="height: 16.112%; left: 51.854%; top: 5.575%;" width="542"/>
|
||||
<span style="left: 71.195%; top: 6.503%;">
|
||||
グラフ
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_searching/">
|
||||
<img alt="" data-hero-asset="chapter_searching" data-source-height="216" data-source-width="216" height="216" src="../assets/home/ad8bb1cc4c28091c/../shared/images/ebfe2b953dbb9d90/chapter_searching.webp" style="height: 15.149%; left: 18.185%; top: 16.404%;" width="216"/>
|
||||
<span style="left: 14.556%; top: 20.876%;">
|
||||
探索
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_sorting/">
|
||||
<img alt="" data-hero-asset="chapter_sorting" data-source-height="137" data-source-width="138" height="137" src="../assets/home/ad8bb1cc4c28091c/../shared/images/9d4be68b2680967c/chapter_sorting.webp" style="height: 9.574%; left: 25.409%; top: 40.747%;" width="138"/>
|
||||
<span style="left: 28.805%; top: 53.808%;">
|
||||
ソート
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_divide_and_conquer/">
|
||||
<img alt="" data-hero-asset="chapter_divide_and_conquer" data-source-height="269" data-source-width="407" height="269" src="../assets/home/ad8bb1cc4c28091c/../shared/images/6f5766ca9385cd2e/chapter_divide_and_conquer.webp" style="height: 18.681%; left: 32.721%; top: 4.816%;" width="407"/>
|
||||
<span style="left: 31.42%; top: 8.679%;">
|
||||
分割統治
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_backtracking/">
|
||||
<img alt="" data-hero-asset="chapter_backtracking" data-source-height="249" data-source-width="345" height="249" src="../assets/home/ad8bb1cc4c28091c/../shared/images/176675e685febf11/chapter_backtracking.webp" style="height: 17.338%; left: 4.875%; top: 32.925%;" width="345"/>
|
||||
<span style="left: 4.742%; top: 50.113%;">
|
||||
バックトラッキング
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_dynamic_programming/">
|
||||
<img alt="" data-hero-asset="chapter_dynamic_programming" data-source-height="268" data-source-width="267" height="268" src="../assets/home/ad8bb1cc4c28091c/../shared/images/06264b1ffd05b08e/chapter_dynamic_programming.webp" style="height: 15.47%; left: 9.406%; top: 57.472%;" width="267"/>
|
||||
<span style="left: 8.561%; top: 75.351%;">
|
||||
動的計画法
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_greedy/">
|
||||
<img alt="" data-hero-asset="chapter_greedy" data-source-height="202" data-source-width="265" height="202" src="../assets/home/ad8bb1cc4c28091c/../shared/images/2ce6caaac951c40b/chapter_greedy.webp" style="height: 14.127%; left: 23.132%; top: 75.803%;" width="265"/>
|
||||
<span style="left: 21.619%; top: 86.85%;">
|
||||
貪欲法
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="heading-div">
|
||||
<img alt="" loading="lazy" src="https://readme-typing-svg.demolab.com/?font=Noto+Sans+JP&weight=400&duration=3500&pause=2000&color=FFF&center=true&vCenter=true&random=false&width=200&lines=Hello%2C+Algo+!" style="height: min(9vh, 12vw);"/>
|
||||
<div style="pointer-events: auto;">
|
||||
<p style="margin-top: max(-1vh, -2vw); margin-bottom: min(2vh, 3.5vw);">
|
||||
アニメーションによる図解とワンクリックで実行できるコードで学ぶ、データ構造とアルゴリズムの入門書
|
||||
</p>
|
||||
<a class="rounded-button" href="chapter_hello_algo/">
|
||||
<svg viewbox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
|
||||
<path d="M160 96a96 96 0 1 1 192 0A96 96 0 1 1 160 96zm80 152V512l-48.4-24.2c-20.9-10.4-43.5-17-66.8-19.3l-96-9.6C12.5 457.2 0 443.5 0 427V224c0-17.7 14.3-32 32-32H62.3c63.6 0 125.6 19.6 177.7 56zm32 264V248c52.1-36.4 114.1-56 177.7-56H480c17.7 0 32 14.3 32 32V427c0 16.4-12.5 30.2-28.8 31.8l-96 9.6c-23.2 2.3-45.9 8.9-66.8 19.3L272 512z">
|
||||
</path>
|
||||
</svg>
|
||||
<span>
|
||||
読み始める
|
||||
</span>
|
||||
</a>
|
||||
<a class="rounded-button" href="https://github.com/krahets/hello-algo">
|
||||
<svg viewbox="0 0 496 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3 .3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5 .3-6.2 2.3zm44.2-1.7c-2.9 .7-4.9 2.6-4.6 4.9 .3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3 .7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3 .3 2.9 2.3 3.9 1.6 1 3.6 .7 4.3-.7 .7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3 .7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3 .7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z">
|
||||
</path>
|
||||
</svg>
|
||||
<span>
|
||||
GitHub
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<div style="text-align: center; margin-top: min(2.5vh, 3.5vw);">
|
||||
<svg fill="var(--md-default-fg-color)" height="2vh" viewbox="0 0 384 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M169.4 470.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 370.8 224 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 306.7L54.6 265.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z">
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Section: reading -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content">
|
||||
<div class="reading-media">
|
||||
<!-- devices -->
|
||||
<!-- book height = 250 mm -->
|
||||
<!-- mac height = 248.1 mm -->
|
||||
<!-- ipad height = 280.6mm -->
|
||||
<!-- iphone height = 160.7mm -->
|
||||
<div class="media-block">
|
||||
<a href="chapter_hello_algo/">
|
||||
<div style="height: 4.34%;"></div>
|
||||
<img class="device-on-hover" style="height: 66.31%;" src="assets/hero/web_mac_iphone.png" alt="">
|
||||
<div style="height: 4.34%;"></div>
|
||||
<div class="text-button">
|
||||
<span>オンラインで読む</span>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z" />
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="media-block">
|
||||
<a href="https://github.com/krahets/hello-algo/releases">
|
||||
<img class="device-on-hover" style="height: 75%;" src="assets/hero/pdf_ipad.png" alt="">
|
||||
<div class="text-button">
|
||||
<span>既存の PDF/EPUB を確認</span>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z" />
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<p>日本語版はオンラインで公開しています。ダウンロード先には既存の各言語版が掲載されており、今回の公開に伴う新たな日本語 PDF/EPUB の配布はありません。</p>
|
||||
<p style="margin-top: 2em;">500 点のアニメーション図解、14 種類のプログラミング言語のコード、コミュニティでの 3000 件の質問と回答が、データ構造とアルゴリズムの入門を支えます。</p>
|
||||
</div>
|
||||
<section class="home-div" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="section-content">
|
||||
<div class="reading-media">
|
||||
<div class="media-block">
|
||||
<a href="chapter_hello_algo/">
|
||||
<div style="height: 4.34%;">
|
||||
</div>
|
||||
<img alt="" class="device-on-hover" data-home-src="../assets/home/ad8bb1cc4c28091c/../shared/images/5b64cf7672ec5ec6/web_mac_iphone.webp" decoding="async" height="965" style="height: 66.31%;" width="1598"/>
|
||||
<noscript>
|
||||
<img alt="" class="device-on-hover" height="965" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/5b64cf7672ec5ec6/web_mac_iphone.webp" style="height: 66.31%;" width="1598"/>
|
||||
</noscript>
|
||||
<div style="height: 4.34%;">
|
||||
</div>
|
||||
<div class="text-button">
|
||||
<span>
|
||||
オンラインで読む
|
||||
</span>
|
||||
<svg viewbox="0 0 320 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z">
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="media-block">
|
||||
<a href="https://github.com/krahets/hello-algo/releases">
|
||||
<img alt="" class="device-on-hover" data-home-src="../assets/home/ad8bb1cc4c28091c/../shared/images/66baa2f9bf3abec7/pdf_ipad.webp" decoding="async" height="960" style="height: 75%;" width="812"/>
|
||||
<noscript>
|
||||
<img alt="" class="device-on-hover" height="960" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/66baa2f9bf3abec7/pdf_ipad.webp" style="height: 75%;" width="812"/>
|
||||
</noscript>
|
||||
<div class="text-button">
|
||||
<span>
|
||||
既存の PDF/EPUB を確認
|
||||
</span>
|
||||
<svg viewbox="0 0 320 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z">
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<p style="">
|
||||
日本語版はオンラインで公開しています。ダウンロード先には既存の各言語版が掲載されており、今回の公開に伴う新たな日本語 PDF/EPUB の配布はありません。
|
||||
</p>
|
||||
<p style="margin-top: 2em;">
|
||||
500 点のアニメーション図解、14 種類のプログラミング言語のコード、コミュニティでの 3000 件の質問と回答が、データ構造とアルゴリズムの入門を支えます。
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Section: endorsements -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content">
|
||||
<h3 style="text-align: center; margin: 1em auto;">推薦の言葉</h3>
|
||||
<div class="intro-container endor-container">
|
||||
<div class="intro-text endor-text">
|
||||
<p style="margin-bottom: 0;">「手を動かし、考えながら学べる、わかりやすいデータ構造とアルゴリズムの入門書です。アルゴリズムを初めて学ぶ方に、ぜひおすすめします。」</p>
|
||||
<p style="font-weight: bold;">—— 邓俊辉、清華大学コンピュータ科学系教授</p>
|
||||
</div>
|
||||
<div class="intro-text endor-text">
|
||||
<p style="margin-bottom: 0;">「私がデータ構造とアルゴリズムを学んでいた頃に『Hello Algo』があれば、学ぶのが 10 倍楽になっていたでしょう！」</p>
|
||||
<p style="font-weight: bold;">—— 李沐、Amazon シニア・プリンシパル・サイエンティスト</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<section class="home-div" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="section-content">
|
||||
<h3 style="text-align: center; margin: 1em auto;">
|
||||
推薦の言葉
|
||||
</h3>
|
||||
<div class="intro-container endor-container">
|
||||
<div class="intro-text endor-text">
|
||||
<p style="margin-bottom: 0;">
|
||||
「手を動かし、考えながら学べる、わかりやすいデータ構造とアルゴリズムの入門書です。アルゴリズムを初めて学ぶ方に、ぜひおすすめします。」
|
||||
</p>
|
||||
<p style="font-weight: bold;">
|
||||
—— 邓俊辉、清華大学コンピュータ科学系教授
|
||||
</p>
|
||||
</div>
|
||||
<div class="intro-text endor-text">
|
||||
<p style="margin-bottom: 0;">
|
||||
「私がデータ構造とアルゴリズムを学んでいた頃に『Hello Algo』があれば、学ぶのが 10 倍楽になっていたでしょう！」
|
||||
</p>
|
||||
<p style="font-weight: bold;">
|
||||
—— 李沐、Amazon シニア・プリンシパル・サイエンティスト
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Section: features -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content">
|
||||
<div class="intro-container">
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="1.5em" width="1.5em" viewBox="0 0 640 512">
|
||||
<path fill="var(--md-primary-bg-color)" d="M256 0H576c35.3 0 64 28.7 64 64V288c0 35.3-28.7 64-64 64H256c-35.3 0-64-28.7-64-64V64c0-35.3 28.7-64 64-64zM476 106.7C471.5 100 464 96 456 96s-15.5 4-20 10.7l-56 84L362.7 169c-4.6-5.7-11.5-9-18.7-9s-14.2 3.3-18.7 9l-64 80c-5.8 7.2-6.9 17.1-2.9 25.4s12.4 13.6 21.6 13.6h80 48H552c8.9 0 17-4.9 21.2-12.7s3.7-17.3-1.2-24.6l-96-144zM336 96a32 32 0 1 0 -64 0 32 32 0 1 0 64 0zM64 128h96V384v32c0 17.7 14.3 32 32 32H320c17.7 0 32-14.3 32-32V384H512v64c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V192c0-35.3 28.7-64 64-64zm8 64c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V208c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V312c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H72zm336 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H424c-8.8 0-16 7.2-16 16z" />
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">アニメーションによる図解</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">わかりやすい内容で、無理なく学べます</p>
|
||||
<p class="intro-quote">"A picture is worth a thousand words."<br>「一枚の図は千の言葉に勝る」</p>
|
||||
</div>
|
||||
</div>
|
||||
<video class="intro-image" src="index.assets/animation.mp4" autoplay loop muted playsinline aria-label="アルゴリズムの動きを示すアニメーション"></video>
|
||||
</div>
|
||||
|
||||
<div class="intro-container">
|
||||
<video class="intro-image" src="index.assets/running_code.mp4" autoplay loop muted playsinline aria-label="コードを実行する例"></video>
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="1.5em" width="1.5em" viewBox="0 0 640 512">
|
||||
<path fill="var(--md-primary-bg-color)" d="M392.8 1.2c-17-4.9-34.7 5-39.6 22l-128 448c-4.9 17 5 34.7 22 39.6s34.7-5 39.6-22l128-448c4.9-17-5-34.7-22-39.6zm80.6 120.1c-12.5 12.5-12.5 32.8 0 45.3L562.7 256l-89.4 89.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l112-112c12.5-12.5 12.5-32.8 0-45.3l-112-112c-12.5-12.5-32.8-12.5-45.3 0zm-306.7 0c-12.5-12.5-32.8-12.5-45.3 0l-112 112c-12.5 12.5-12.5 32.8 0 45.3l112 112c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256l89.4-89.4c12.5-12.5 12.5-32.8 0-45.3z" />
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">ワンクリックで実行</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">十数種類のプログラミング言語に対応し、コードの実行を可視化できます</p>
|
||||
<p class="intro-quote">"Talk is cheap. Show me the code."<br>「口で語るより、コードを見せよう」</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="intro-container">
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="1.5em" width="1.5em" viewBox="0 0 640 512">
|
||||
<path fill="var(--md-primary-bg-color)" d="M88.2 309.1c9.8-18.3 6.8-40.8-7.5-55.8C59.4 230.9 48 204 48 176c0-63.5 63.8-128 160-128s160 64.5 160 128s-63.8 128-160 128c-13.1 0-25.8-1.3-37.8-3.6c-10.4-2-21.2-.6-30.7 4.2c-4.1 2.1-8.3 4.1-12.6 6c-16 7.2-32.9 13.5-49.9 18c2.8-4.6 5.4-9.1 7.9-13.6c1.1-1.9 2.2-3.9 3.2-5.9zM0 176c0 41.8 17.2 80.1 45.9 110.3c-.9 1.7-1.9 3.5-2.8 5.1c-10.3 18.4-22.3 36.5-36.6 52.1c-6.6 7-8.3 17.2-4.6 25.9C5.8 378.3 14.4 384 24 384c43 0 86.5-13.3 122.7-29.7c4.8-2.2 9.6-4.5 14.2-6.8c15.1 3 30.9 4.5 47.1 4.5c114.9 0 208-78.8 208-176S322.9 0 208 0S0 78.8 0 176zM432 480c16.2 0 31.9-1.6 47.1-4.5c4.6 2.3 9.4 4.6 14.2 6.8C529.5 498.7 573 512 616 512c9.6 0 18.2-5.7 22-14.5c3.8-8.8 2-19-4.6-25.9c-14.2-15.6-26.2-33.7-36.6-52.1c-.9-1.7-1.9-3.4-2.8-5.1C622.8 384.1 640 345.8 640 304c0-94.4-87.9-171.5-198.2-175.8c4.1 15.2 6.2 31.2 6.2 47.8l0 .6c87.2 6.7 144 67.5 144 127.4c0 28-11.4 54.9-32.7 77.2c-14.3 15-17.3 37.6-7.5 55.8c1.1 2 2.2 4 3.2 5.9c2.5 4.5 5.2 9 7.9 13.6c-17-4.5-33.9-10.7-49.9-18c-4.3-1.9-8.5-3.9-12.6-6c-9.5-4.8-20.3-6.2-30.7-4.2c-12.1 2.4-24.7 3.6-37.8 3.6c-61.7 0-110-26.5-136.8-62.3c-16 5.4-32.8 9.4-50 11.8C279 439.8 350 480 432 480z" />
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">読者同士で学び合う</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">質問や意見を交わし、読者同士で一緒に理解を深めましょう</p>
|
||||
<p class="intro-quote">"Learning by teaching."<br>「教えることも、学びにつながる」</p>
|
||||
</div>
|
||||
</div>
|
||||
<video class="intro-image" src="index.assets/comment.mp4" autoplay loop muted playsinline aria-label="コメントで学び合う例"></video>
|
||||
</div>
|
||||
|
||||
<section class="home-div" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="section-content">
|
||||
<div class="intro-container">
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg height="1.5em" viewbox="0 0 640 512" width="1.5em" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M256 0H576c35.3 0 64 28.7 64 64V288c0 35.3-28.7 64-64 64H256c-35.3 0-64-28.7-64-64V64c0-35.3 28.7-64 64-64zM476 106.7C471.5 100 464 96 456 96s-15.5 4-20 10.7l-56 84L362.7 169c-4.6-5.7-11.5-9-18.7-9s-14.2 3.3-18.7 9l-64 80c-5.8 7.2-6.9 17.1-2.9 25.4s12.4 13.6 21.6 13.6h80 48H552c8.9 0 17-4.9 21.2-12.7s3.7-17.3-1.2-24.6l-96-144zM336 96a32 32 0 1 0 -64 0 32 32 0 1 0 64 0zM64 128h96V384v32c0 17.7 14.3 32 32 32H320c17.7 0 32-14.3 32-32V384H512v64c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V192c0-35.3 28.7-64 64-64zm8 64c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V208c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V312c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H72zm336 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H424c-8.8 0-16 7.2-16 16z" fill="var(--md-primary-bg-color)">
|
||||
</path>
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">
|
||||
アニメーションによる図解
|
||||
</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">
|
||||
わかりやすい内容で、無理なく学べます
|
||||
</p>
|
||||
<p class="intro-quote">
|
||||
"A picture is worth a thousand words."
|
||||
<br/>
|
||||
「一枚の図は千の言葉に勝る」
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Section: contributors -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content" style="max-width: 90vw;">
|
||||
<!-- author -->
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>著者</h3>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/krahets">
|
||||
<img class="profile-img" src="assets/avatar/avatar_yudongjin.jpg" alt="著者：yudongjin" />
|
||||
<br><b>靳宇栋（@krahets）</b>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- code reviewers -->
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>コードのレビュー担当者</h3>
|
||||
<p>原書のさまざまな言語によるコードは、次の開発者の協力によって作られました。その尽力と貢献に感謝します！</p>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/coderonion">
|
||||
<img class="profile-img" src="assets/avatar/avatar_coderonion.jpg" alt="コードのレビュー担当者：coderonion" />
|
||||
<br><b>coderonion</b>
|
||||
<br><sub>Zig, Rust</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/curtishd">
|
||||
<img class="profile-img" src="assets/avatar/avatar_curtishd.jpg" alt="コードのレビュー担当者：curtishd" />
|
||||
<br><b>curtishd</b>
|
||||
<br><sub>Kotlin</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/Gonglja">
|
||||
<img class="profile-img" src="assets/avatar/avatar_Gonglja.jpg" alt="コードのレビュー担当者：Gonglja" />
|
||||
<br><b>Gonglja</b>
|
||||
<br><sub>C, C++</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/gvenusleo">
|
||||
<img class="profile-img" src="assets/avatar/avatar_gvenusleo.jpg" alt="コードのレビュー担当者：gvenusleo" />
|
||||
<br><b>gvenusleo</b>
|
||||
<br><sub>Dart</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/hpstory">
|
||||
<img class="profile-img" src="assets/avatar/avatar_hpstory.jpg" alt="コードのレビュー担当者：hpstory" />
|
||||
<br><b>hpstory</b>
|
||||
<br><sub>C#</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/justin-tse">
|
||||
<img class="profile-img" src="assets/avatar/avatar_justin-tse.jpg" alt="コードのレビュー担当者：justin-tse" />
|
||||
<br><b>justin-tse</b>
|
||||
<br><sub>JS, TS</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/khoaxuantu">
|
||||
<img class="profile-img" src="assets/avatar/avatar_khoaxuantu.jpg" alt="コードのレビュー担当者：khoaxuantu" />
|
||||
<br><b>khoaxuantu</b>
|
||||
<br><sub>Ruby</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/krahets">
|
||||
<img class="profile-img" src="assets/avatar/avatar_krahets.jpg" alt="コードのレビュー担当者：krahets" />
|
||||
<br><b>krahets</b>
|
||||
<br><sub>Python, Java</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/night-cruise">
|
||||
<img class="profile-img" src="assets/avatar/avatar_night-cruise.jpg" alt="コードのレビュー担当者：night-cruise" />
|
||||
<br><b>night-cruise</b>
|
||||
<br><sub>Rust</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/nuomi1">
|
||||
<img class="profile-img" src="assets/avatar/avatar_nuomi1.jpg" alt="コードのレビュー担当者：nuomi1" />
|
||||
<br><b>nuomi1</b>
|
||||
<br><sub>Swift</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/Reanon">
|
||||
<img class="profile-img" src="assets/avatar/avatar_Reanon.jpg" alt="コードのレビュー担当者：Reanon" />
|
||||
<br><b>Reanon</b>
|
||||
<br><sub>Go, C</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/rongyi">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_rongyi.jpg" alt="コードのレビュー担当者：rongyi" />
|
||||
<br><b>rongyi</b>
|
||||
<br><sub>Rust</sub>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- contributors -->
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>貢献者</h3>
|
||||
<p>本書は、オープンソースコミュニティの 200 人以上の貢献者の協力により、改善を重ねています。時間と労力を注いでくださった皆さんに感謝します！</p>
|
||||
<a href="https://github.com/krahets/hello-algo/graphs/contributors">
|
||||
<img src="https://contrib.rocks/image?repo=krahets/hello-algo&max=300&columns=12" alt="貢献者の皆さん" style="width: 100%; max-width: 38.5em;">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<video aria-label="アルゴリズムの動きを示すアニメーション" class="intro-image" data-home-poster="../assets/home/ad8bb1cc4c28091c/../shared/images/9e5f39bf33afc70f/animation-poster.webp" data-home-video="../assets/home/ad8bb1cc4c28091c/../shared/media/6c70de2b2bf4eef7/animation.mp4" height="1080" loop="" muted="" playsinline="" preload="none" style="aspect-ratio: 1600 / 1080" width="1600">
|
||||
</video>
|
||||
<noscript>
|
||||
<a href="../assets/home/ad8bb1cc4c28091c/../shared/media/6c70de2b2bf4eef7/animation.mp4">
|
||||
<img alt="アルゴリズムの動きを示すアニメーション" class="intro-image" height="1080" src="../assets/home/ad8bb1cc4c28091c/../shared/images/9e5f39bf33afc70f/animation-poster.webp" width="1600"/>
|
||||
アニメーションによる図解
|
||||
</a>
|
||||
</noscript>
|
||||
</div>
|
||||
<div class="intro-container">
|
||||
<video aria-label="コードを実行する例" class="intro-image" data-home-poster="../assets/home/ad8bb1cc4c28091c/../shared/images/f33a13e8331245ae/running_code-poster.webp" data-home-video="../assets/home/ad8bb1cc4c28091c/../shared/media/bb169a96ca8316da/running_code.mp4" height="1082" loop="" muted="" playsinline="" preload="none" style="aspect-ratio: 1600 / 1082" width="1600">
|
||||
</video>
|
||||
<noscript>
|
||||
<a href="../assets/home/ad8bb1cc4c28091c/../shared/media/bb169a96ca8316da/running_code.mp4">
|
||||
<img alt="コードを実行する例" class="intro-image" height="1082" src="../assets/home/ad8bb1cc4c28091c/../shared/images/f33a13e8331245ae/running_code-poster.webp" width="1600"/>
|
||||
ワンクリックで実行
|
||||
</a>
|
||||
</noscript>
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg height="1.5em" viewbox="0 0 640 512" width="1.5em" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M392.8 1.2c-17-4.9-34.7 5-39.6 22l-128 448c-4.9 17 5 34.7 22 39.6s34.7-5 39.6-22l128-448c4.9-17-5-34.7-22-39.6zm80.6 120.1c-12.5 12.5-12.5 32.8 0 45.3L562.7 256l-89.4 89.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l112-112c12.5-12.5 12.5-32.8 0-45.3l-112-112c-12.5-12.5-32.8-12.5-45.3 0zm-306.7 0c-12.5-12.5-32.8-12.5-45.3 0l-112 112c-12.5 12.5-12.5 32.8 0 45.3l112 112c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256l89.4-89.4c12.5-12.5 12.5-32.8 0-45.3z" fill="var(--md-primary-bg-color)">
|
||||
</path>
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">
|
||||
ワンクリックで実行
|
||||
</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">
|
||||
十数種類のプログラミング言語に対応し、コードの実行を可視化できます
|
||||
</p>
|
||||
<p class="intro-quote">
|
||||
"Talk is cheap. Show me the code."
|
||||
<br/>
|
||||
「口で語るより、コードを見せよう」
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="intro-container">
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg height="1.5em" viewbox="0 0 640 512" width="1.5em" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M88.2 309.1c9.8-18.3 6.8-40.8-7.5-55.8C59.4 230.9 48 204 48 176c0-63.5 63.8-128 160-128s160 64.5 160 128s-63.8 128-160 128c-13.1 0-25.8-1.3-37.8-3.6c-10.4-2-21.2-.6-30.7 4.2c-4.1 2.1-8.3 4.1-12.6 6c-16 7.2-32.9 13.5-49.9 18c2.8-4.6 5.4-9.1 7.9-13.6c1.1-1.9 2.2-3.9 3.2-5.9zM0 176c0 41.8 17.2 80.1 45.9 110.3c-.9 1.7-1.9 3.5-2.8 5.1c-10.3 18.4-22.3 36.5-36.6 52.1c-6.6 7-8.3 17.2-4.6 25.9C5.8 378.3 14.4 384 24 384c43 0 86.5-13.3 122.7-29.7c4.8-2.2 9.6-4.5 14.2-6.8c15.1 3 30.9 4.5 47.1 4.5c114.9 0 208-78.8 208-176S322.9 0 208 0S0 78.8 0 176zM432 480c16.2 0 31.9-1.6 47.1-4.5c4.6 2.3 9.4 4.6 14.2 6.8C529.5 498.7 573 512 616 512c9.6 0 18.2-5.7 22-14.5c3.8-8.8 2-19-4.6-25.9c-14.2-15.6-26.2-33.7-36.6-52.1c-.9-1.7-1.9-3.4-2.8-5.1C622.8 384.1 640 345.8 640 304c0-94.4-87.9-171.5-198.2-175.8c4.1 15.2 6.2 31.2 6.2 47.8l0 .6c87.2 6.7 144 67.5 144 127.4c0 28-11.4 54.9-32.7 77.2c-14.3 15-17.3 37.6-7.5 55.8c1.1 2 2.2 4 3.2 5.9c2.5 4.5 5.2 9 7.9 13.6c-17-4.5-33.9-10.7-49.9-18c-4.3-1.9-8.5-3.9-12.6-6c-9.5-4.8-20.3-6.2-30.7-4.2c-12.1 2.4-24.7 3.6-37.8 3.6c-61.7 0-110-26.5-136.8-62.3c-16 5.4-32.8 9.4-50 11.8C279 439.8 350 480 432 480z" fill="var(--md-primary-bg-color)">
|
||||
</path>
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">
|
||||
読者同士で学び合う
|
||||
</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">
|
||||
質問や意見を交わし、読者同士で一緒に理解を深めましょう
|
||||
</p>
|
||||
<p class="intro-quote">
|
||||
"Learning by teaching."
|
||||
<br/>
|
||||
「教えることも、学びにつながる」
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<video aria-label="コメントで学び合う例" class="intro-image" data-home-poster="../assets/home/ad8bb1cc4c28091c/../shared/images/f9ac69536a7582f5/comment-poster.webp" data-home-video="../assets/home/ad8bb1cc4c28091c/../shared/media/62aa0b8d351c63a7/comment.mp4" height="1080" loop="" muted="" playsinline="" preload="none" style="aspect-ratio: 1600 / 1080" width="1600">
|
||||
</video>
|
||||
<noscript>
|
||||
<a href="../assets/home/ad8bb1cc4c28091c/../shared/media/62aa0b8d351c63a7/comment.mp4">
|
||||
<img alt="コメントで学び合う例" class="intro-image" height="1080" src="../assets/home/ad8bb1cc4c28091c/../shared/images/f9ac69536a7582f5/comment-poster.webp" width="1600"/>
|
||||
読者同士で学び合う
|
||||
</a>
|
||||
</noscript>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="home-div" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="section-content" style="max-width: 90vw;">
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>
|
||||
著者
|
||||
</h3>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/krahets">
|
||||
<img alt="著者：yudongjin" class="profile-img" height="512" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/02348410d40f7665/avatar_yudongjin.webp" width="512"/>
|
||||
<br/>
|
||||
<b>
|
||||
靳宇栋（@krahets）
|
||||
</b>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>
|
||||
コードのレビュー担当者
|
||||
</h3>
|
||||
<p>
|
||||
原書のさまざまな言語によるコードは、次の開発者の協力によって作られました。その尽力と貢献に感謝します！
|
||||
</p>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/coderonion">
|
||||
<img alt="コードのレビュー担当者：coderonion" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/db606f27971eae34/avatar_coderonion.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
coderonion
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Zig, Rust
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/curtishd">
|
||||
<img alt="コードのレビュー担当者：curtishd" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/feedb0e547ea31fc/avatar_curtishd.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
curtishd
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Kotlin
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/Gonglja">
|
||||
<img alt="コードのレビュー担当者：Gonglja" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/cdcf023b032b8d30/avatar_Gonglja.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
Gonglja
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
C, C++
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/gvenusleo">
|
||||
<img alt="コードのレビュー担当者：gvenusleo" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/464e2d351b9263ec/avatar_gvenusleo.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
gvenusleo
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Dart
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/hpstory">
|
||||
<img alt="コードのレビュー担当者：hpstory" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/7b6478acdab6b845/avatar_hpstory.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
hpstory
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
C#
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/justin-tse">
|
||||
<img alt="コードのレビュー担当者：justin-tse" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/208ee5aae490eefa/avatar_justin-tse.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
justin-tse
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
JS, TS
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/khoaxuantu">
|
||||
<img alt="コードのレビュー担当者：khoaxuantu" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/9d3f1a21ff51de78/avatar_khoaxuantu.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
khoaxuantu
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Ruby
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/krahets">
|
||||
<img alt="コードのレビュー担当者：krahets" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/e321f9a3ac2739e0/avatar_krahets.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
krahets
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Python, Java
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/night-cruise">
|
||||
<img alt="コードのレビュー担当者：night-cruise" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/960b489efa22abd4/avatar_night-cruise.jpg" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
night-cruise
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Rust
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/nuomi1">
|
||||
<img alt="コードのレビュー担当者：nuomi1" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/7316a9eb4429b259/avatar_nuomi1.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
nuomi1
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Swift
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/Reanon">
|
||||
<img alt="コードのレビュー担当者：Reanon" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/dcc15aa68cc793c7/avatar_Reanon.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
Reanon
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Go, C
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/rongyi">
|
||||
<img alt="コードのレビュー担当者：rongyi" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/5dc6c4b1d8bfe0ac/avatar_rongyi.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
rongyi
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Rust
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>
|
||||
貢献者
|
||||
</h3>
|
||||
<p>
|
||||
本書は、オープンソースコミュニティの 200 人以上の貢献者の協力により、改善を重ねています。時間と労力を注いでくださった皆さんに感謝します！
|
||||
</p>
|
||||
<a href="https://github.com/krahets/hello-algo/graphs/contributors">
|
||||
<img alt="貢献者の皆さん" loading="lazy" src="https://contrib.rocks/image?repo=krahets/hello-algo&max=300&columns=12" style="width: 100%; max-width: 38.5em;"/>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<!-- This independent fallback also works when the deferred loader cannot be fetched. -->
|
||||
<script defer="" onerror="document.querySelectorAll('[data-home-src], [data-home-poster]').forEach(function(el) { if (el.dataset.homeSrc) el.src = el.dataset.homeSrc; if (el.dataset.homePoster) el.poster = el.dataset.homePoster; });" src="../assets/home/ad8bb1cc4c28091c/javascripts/homepage-media.js">
|
||||
</script>
|
||||
|
||||
BIN
ko/docs/assets/hero/astronaut.webp
Normal file
BIN
ko/docs/assets/hero/astronaut.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 274 KiB |
BIN
ko/docs/assets/hero/ground.webp
Normal file
BIN
ko/docs/assets/hero/ground.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 276 KiB |
@@ -1,324 +1,503 @@
|
||||
<!-- Section: hero -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div" style="height: min(100vh, 120vw); position: relative; margin-top:-2.4rem; padding: 0; overflow: hidden;">
|
||||
<!-- hero image -->
|
||||
<!-- <img alt="" class="hero-bg" src="assets/hero/universe_bg.png" /> -->
|
||||
<div class="starfield">
|
||||
<div class="starfield-origin"></div>
|
||||
</div>
|
||||
<div class="hero-div hero-div--ko">
|
||||
<img src="assets/hero/ground.png" alt="" style="position: absolute; width: auto; height: 26.445%; left: 28.211%; top: 54.145%;">
|
||||
<img src="assets/hero/links.png" alt="" style="position: absolute; width: auto; height: 78.751%; left: 10.545%; top: 7.326%;">
|
||||
<a href="chapter_introduction/">
|
||||
<img src="assets/hero/astronaut.png" alt="" style="height: 46.673%; left: 35.413%; top: 24.343%;">
|
||||
<span style="left: 52.244%; top: 20.919%;">알고리즘과의 첫 만남</span>
|
||||
</a>
|
||||
<a href="chapter_computational_complexity/">
|
||||
<img src="assets/hero/chapter_computational_complexity.png" alt="" style="height: 12.347%; left: 36.267%; top: 37.653%;">
|
||||
<span style="left: 39.244%; top: 33.919%;">복잡도</span>
|
||||
</a>
|
||||
<a href="chapter_array_and_linkedlist/">
|
||||
<img src="assets/hero/chapter_array_and_linkedlist.png" alt="" style="height: 22.242%; left: 73.242%; top: 52.481%;">
|
||||
<span style="left: 90.897%; top: 76.259%;">배열과 연결 리스트</span>
|
||||
</a>
|
||||
<a href="chapter_stack_and_queue/">
|
||||
<img src="assets/hero/chapter_stack_and_queue.png" alt="" style="height: 14.302%; left: 62.646%; top: 77.875%;">
|
||||
<span style="left: 77.571%; top: 91.25%;">스택과 큐</span>
|
||||
</a>
|
||||
<a href="chapter_hashing/">
|
||||
<img src="assets/hero/chapter_hashing.png" alt="" style="height: 15.266%; left: 63.281%; top: 27.933%;">
|
||||
<span style="left: 68.862%; top: 46.292%;">해시 테이블</span>
|
||||
</a>
|
||||
<a href="chapter_tree/">
|
||||
<img src="assets/hero/chapter_tree.png" alt="" style="height: 19.615%; left: 80.137%; top: 26.678%;">
|
||||
<span style="left: 96.159%; top: 44.8%;">트리</span>
|
||||
</a>
|
||||
<a href="chapter_heap/">
|
||||
<img src="assets/hero/chapter_heap.png" alt="" style="height: 10.566%; left: 77.226%; top: 11.559%;">
|
||||
<span style="left: 88.103%; top: 15.422%;">힙</span>
|
||||
</a>
|
||||
<a href="chapter_graph/">
|
||||
<img src="assets/hero/chapter_graph.png" alt="" style="height: 16.112%; left: 51.854%; top: 5.575%;">
|
||||
<span style="left: 71.195%; top: 6.503%;">그래프</span>
|
||||
</a>
|
||||
<a href="chapter_searching/">
|
||||
<img src="assets/hero/chapter_searching.png" alt="" style="height: 15.149%; left: 18.185%; top: 16.404%;">
|
||||
<span style="left: 14.556%; top: 20.876%;">탐색</span>
|
||||
</a>
|
||||
<a href="chapter_sorting/">
|
||||
<img src="assets/hero/chapter_sorting.png" alt="" style="height: 9.574%; left: 25.409%; top: 40.747%;">
|
||||
<span style="left: 28.805%; top: 53.808%;">정렬</span>
|
||||
</a>
|
||||
<a href="chapter_divide_and_conquer/">
|
||||
<img src="assets/hero/chapter_divide_and_conquer.png" alt="" style="height: 18.681%; left: 32.721%; top: 4.816%;">
|
||||
<span style="left: 31.42%; top: 8.679%;">분할 정복</span>
|
||||
</a>
|
||||
<a href="chapter_backtracking/">
|
||||
<img src="assets/hero/chapter_backtracking.png" alt="" style="height: 17.338%; left: 4.875%; top: 32.925%;">
|
||||
<span style="left: 4.742%; top: 50.113%;">백트래킹</span>
|
||||
</a>
|
||||
<a href="chapter_dynamic_programming/">
|
||||
<img src="assets/hero/chapter_dynamic_programming.png" alt="" style="height: 15.47%; left: 9.406%; top: 57.472%;">
|
||||
<span style="left: 8.561%; top: 75.351%;">동적 계획법</span>
|
||||
</a>
|
||||
<a href="chapter_greedy/">
|
||||
<img src="assets/hero/chapter_greedy.png" alt="" style="height: 14.127%; left: 23.132%; top: 75.803%;">
|
||||
<span style="left: 21.619%; top: 86.85%;">탐욕</span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- heading -->
|
||||
<div class="heading-div">
|
||||
<img style="height: min(9vh, 12vw);" src="https://readme-typing-svg.demolab.com/?font=Noto+Sans+KR&weight=400&duration=3500&pause=2000&color=FFF¢er=true&vCenter=true&random=false&width=200&lines=Hello%2C%20%EC%95%8C%EA%B3%A0%EB%A6%AC%EC%A6%98%21" alt="" />
|
||||
<div style="pointer-events: auto;">
|
||||
<p style="margin-top: max(-1vh, -2vw); margin-bottom: min(2vh, 3.5vw);">
|
||||
애니메이션으로 설명하고 클릭 한 번으로 실행하는 자료 구조와 알고리즘 입문서
|
||||
</p>
|
||||
<a href="chapter_hello_algo/" class="rounded-button">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
|
||||
<path d="M160 96a96 96 0 1 1 192 0A96 96 0 1 1 160 96zm80 152V512l-48.4-24.2c-20.9-10.4-43.5-17-66.8-19.3l-96-9.6C12.5 457.2 0 443.5 0 427V224c0-17.7 14.3-32 32-32H62.3c63.6 0 125.6 19.6 177.7 56zm32 264V248c52.1-36.4 114.1-56 177.7-56H480c17.7 0 32 14.3 32 32V427c0 16.4-12.5 30.2-28.8 31.8l-96 9.6c-23.2 2.3-45.9 8.9-66.8 19.3L272 512z" />
|
||||
</svg>
|
||||
<span>읽기 시작하기</span>
|
||||
</a>
|
||||
<a href="https://github.com/krahets/hello-algo" class="rounded-button">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 496 512">
|
||||
<path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3 .3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5 .3-6.2 2.3zm44.2-1.7c-2.9 .7-4.9 2.6-4.6 4.9 .3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3 .7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3 .3 2.9 2.3 3.9 1.6 1 3.6 .7 4.3-.7 .7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3 .7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3 .7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z">
|
||||
</path>
|
||||
</svg>
|
||||
<span>GitHub</span>
|
||||
</a>
|
||||
</div>
|
||||
<!-- arrow -->
|
||||
<div style="text-align: center; margin-top: min(2.5vh, 3.5vw);">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="var(--md-default-fg-color)" height="2vh" viewBox="0 0 384 512">
|
||||
<path d="M169.4 470.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 370.8 224 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 306.7L54.6 265.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z" />
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Generated from the shared homepage template and locale configuration. -->
|
||||
<link href="../assets/home/ad8bb1cc4c28091c/hero-motion.css" rel="stylesheet"/>
|
||||
<noscript>
|
||||
<style>
|
||||
[data-home-src], video[data-home-poster] { display: none; }
|
||||
</style>
|
||||
</noscript>
|
||||
<section class="home-div home-universe-bg" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="starfield">
|
||||
<div class="starfield-origin">
|
||||
</div>
|
||||
</div>
|
||||
<div class="hero-div hero-div--ko" data-home-layout="universe">
|
||||
<img alt="" data-hero-asset="ground" data-source-height="380" data-source-width="881" height="380" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/567306c070a6a7e2/ground.webp" style="position: absolute; width: auto; height: 26.445%; left: 28.211%; top: 54.145%;" width="881"/>
|
||||
<img alt="" data-hero-asset="links" data-source-height="1134" data-source-width="1562" height="1134" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/3e50f38a325c1cb5/links.webp" style="position: absolute; width: auto; height: 78.751%; left: 10.545%; top: 7.326%;" width="1562"/>
|
||||
<a href="chapter_introduction/">
|
||||
<img alt="" data-hero-asset="astronaut" data-source-height="672" data-source-width="515" height="672" src="../assets/home/ad8bb1cc4c28091c/../shared/images/8e5eb3b3e3ebd9f7/astronaut.webp" style="height: 46.673%; left: 35.413%; top: 24.343%;" width="515"/>
|
||||
<span style="left: 52.244%; top: 20.919%;">
|
||||
알고리즘과의 첫 만남
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_computational_complexity/">
|
||||
<img alt="" data-hero-asset="chapter_computational_complexity" data-source-height="178" data-source-width="113" height="178" src="../assets/home/ad8bb1cc4c28091c/../shared/images/2fb425426d1f8d86/chapter_computational_complexity.webp" style="height: 12.347%; left: 36.267%; top: 37.653%;" width="113"/>
|
||||
<span style="left: 39.244%; top: 33.919%;">
|
||||
복잡도
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_array_and_linkedlist/">
|
||||
<img alt="" data-hero-asset="chapter_array_and_linkedlist" data-source-height="319" data-source-width="468" height="319" src="../assets/home/ad8bb1cc4c28091c/../shared/images/5cbbdf7be555d3ef/chapter_array_and_linkedlist.webp" style="height: 22.242%; left: 73.242%; top: 52.481%;" width="468"/>
|
||||
<span style="left: 90.897%; top: 76.259%;">
|
||||
배열과 연결 리스트
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_stack_and_queue/">
|
||||
<img alt="" data-hero-asset="chapter_stack_and_queue" data-source-height="204" data-source-width="204" height="204" src="../assets/home/ad8bb1cc4c28091c/../shared/images/e2667767cf7481bd/chapter_stack_and_queue.webp" style="height: 14.302%; left: 62.646%; top: 77.875%;" width="204"/>
|
||||
<span style="left: 77.571%; top: 91.25%;">
|
||||
스택과 큐
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_hashing/">
|
||||
<img alt="" data-hero-asset="chapter_hashing" data-source-height="218" data-source-width="218" height="218" src="../assets/home/ad8bb1cc4c28091c/../shared/images/b108d70a537714cb/chapter_hashing.webp" style="height: 15.266%; left: 63.281%; top: 27.933%;" width="218"/>
|
||||
<span style="left: 68.862%; top: 46.292%;">
|
||||
해시 테이블
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_tree/">
|
||||
<img alt="" data-hero-asset="chapter_tree" data-source-height="281" data-source-width="280" height="281" src="../assets/home/ad8bb1cc4c28091c/../shared/images/8138bb0acecedec4/chapter_tree.webp" style="height: 19.615%; left: 80.137%; top: 26.678%;" width="280"/>
|
||||
<span style="left: 96.159%; top: 44.8%;">
|
||||
트리
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_heap/">
|
||||
<img alt="" data-hero-asset="chapter_heap" data-source-height="152" data-source-width="151" height="152" src="../assets/home/ad8bb1cc4c28091c/../shared/images/7586281e6691807a/chapter_heap.webp" style="height: 10.566%; left: 77.226%; top: 11.559%;" width="151"/>
|
||||
<span style="left: 88.103%; top: 15.422%;">
|
||||
힙
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_graph/">
|
||||
<img alt="" data-hero-asset="chapter_graph" data-source-height="272" data-source-width="542" height="272" src="../assets/home/ad8bb1cc4c28091c/../shared/images/175a7f2e7c3cf5f0/chapter_graph.webp" style="height: 16.112%; left: 51.854%; top: 5.575%;" width="542"/>
|
||||
<span style="left: 71.195%; top: 6.503%;">
|
||||
그래프
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_searching/">
|
||||
<img alt="" data-hero-asset="chapter_searching" data-source-height="216" data-source-width="216" height="216" src="../assets/home/ad8bb1cc4c28091c/../shared/images/ebfe2b953dbb9d90/chapter_searching.webp" style="height: 15.149%; left: 18.185%; top: 16.404%;" width="216"/>
|
||||
<span style="left: 14.556%; top: 20.876%;">
|
||||
탐색
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_sorting/">
|
||||
<img alt="" data-hero-asset="chapter_sorting" data-source-height="137" data-source-width="138" height="137" src="../assets/home/ad8bb1cc4c28091c/../shared/images/9d4be68b2680967c/chapter_sorting.webp" style="height: 9.574%; left: 25.409%; top: 40.747%;" width="138"/>
|
||||
<span style="left: 28.805%; top: 53.808%;">
|
||||
정렬
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_divide_and_conquer/">
|
||||
<img alt="" data-hero-asset="chapter_divide_and_conquer" data-source-height="269" data-source-width="407" height="269" src="../assets/home/ad8bb1cc4c28091c/../shared/images/6f5766ca9385cd2e/chapter_divide_and_conquer.webp" style="height: 18.681%; left: 32.721%; top: 4.816%;" width="407"/>
|
||||
<span style="left: 31.42%; top: 8.679%;">
|
||||
분할 정복
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_backtracking/">
|
||||
<img alt="" data-hero-asset="chapter_backtracking" data-source-height="249" data-source-width="345" height="249" src="../assets/home/ad8bb1cc4c28091c/../shared/images/176675e685febf11/chapter_backtracking.webp" style="height: 17.338%; left: 4.875%; top: 32.925%;" width="345"/>
|
||||
<span style="left: 4.742%; top: 50.113%;">
|
||||
백트래킹
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_dynamic_programming/">
|
||||
<img alt="" data-hero-asset="chapter_dynamic_programming" data-source-height="268" data-source-width="267" height="268" src="../assets/home/ad8bb1cc4c28091c/../shared/images/06264b1ffd05b08e/chapter_dynamic_programming.webp" style="height: 15.47%; left: 9.406%; top: 57.472%;" width="267"/>
|
||||
<span style="left: 8.561%; top: 75.351%;">
|
||||
동적 계획법
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_greedy/">
|
||||
<img alt="" data-hero-asset="chapter_greedy" data-source-height="202" data-source-width="265" height="202" src="../assets/home/ad8bb1cc4c28091c/../shared/images/2ce6caaac951c40b/chapter_greedy.webp" style="height: 14.127%; left: 23.132%; top: 75.803%;" width="265"/>
|
||||
<span style="left: 21.619%; top: 86.85%;">
|
||||
탐욕
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="heading-div">
|
||||
<img alt="" loading="lazy" src="https://readme-typing-svg.demolab.com/?font=Noto+Sans+KR&weight=400&duration=3500&pause=2000&color=FFF&center=true&vCenter=true&random=false&width=200&lines=Hello%2C%20%EC%95%8C%EA%B3%A0%EB%A6%AC%EC%A6%98%21" style="height: min(9vh, 12vw);"/>
|
||||
<div style="pointer-events: auto;">
|
||||
<p style="margin-top: max(-1vh, -2vw); margin-bottom: min(2vh, 3.5vw);">
|
||||
애니메이션으로 설명하고 클릭 한 번으로 실행하는 자료 구조와 알고리즘 입문서
|
||||
</p>
|
||||
<a class="rounded-button" href="chapter_hello_algo/">
|
||||
<svg viewbox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
|
||||
<path d="M160 96a96 96 0 1 1 192 0A96 96 0 1 1 160 96zm80 152V512l-48.4-24.2c-20.9-10.4-43.5-17-66.8-19.3l-96-9.6C12.5 457.2 0 443.5 0 427V224c0-17.7 14.3-32 32-32H62.3c63.6 0 125.6 19.6 177.7 56zm32 264V248c52.1-36.4 114.1-56 177.7-56H480c17.7 0 32 14.3 32 32V427c0 16.4-12.5 30.2-28.8 31.8l-96 9.6c-23.2 2.3-45.9 8.9-66.8 19.3L272 512z">
|
||||
</path>
|
||||
</svg>
|
||||
<span>
|
||||
읽기 시작하기
|
||||
</span>
|
||||
</a>
|
||||
<a class="rounded-button" href="https://github.com/krahets/hello-algo">
|
||||
<svg viewbox="0 0 496 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3 .3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5 .3-6.2 2.3zm44.2-1.7c-2.9 .7-4.9 2.6-4.6 4.9 .3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3 .7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3 .3 2.9 2.3 3.9 1.6 1 3.6 .7 4.3-.7 .7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3 .7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3 .7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z">
|
||||
</path>
|
||||
</svg>
|
||||
<span>
|
||||
GitHub
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<div style="text-align: center; margin-top: min(2.5vh, 3.5vw);">
|
||||
<svg fill="var(--md-default-fg-color)" height="2vh" viewbox="0 0 384 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M169.4 470.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 370.8 224 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 306.7L54.6 265.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z">
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Section: reading -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content">
|
||||
<div class="reading-media">
|
||||
<!-- devices -->
|
||||
<!-- mac height = 248.1 mm -->
|
||||
<!-- ipad height = 280.6mm -->
|
||||
<!-- iphone height = 160.7mm -->
|
||||
<div class="media-block">
|
||||
<a href="chapter_hello_algo/">
|
||||
<div style="height: 4.34%;"></div>
|
||||
<img class="device-on-hover" style="height: 66.31%;" src="assets/hero/web_mac_iphone.png" alt="">
|
||||
<div style="height: 4.34%;"></div>
|
||||
<div class="text-button">
|
||||
<span>온라인으로 읽기</span>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z" />
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="media-block">
|
||||
<a href="https://github.com/krahets/hello-algo/releases">
|
||||
<img class="device-on-hover" style="height: 75%;" src="assets/hero/pdf_ipad.png" alt="">
|
||||
<div class="text-button">
|
||||
<span>PDF/EPUB 제공 언어 확인</span>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z" />
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<p style="margin-top: 2em;">500개의 애니메이션 그림, 14개 프로그래밍 언어의 코드, 3000개의 커뮤니티 질문과 답변으로 자료 구조와 알고리즘의 기초를 빠르게 익힐 수 있다</p>
|
||||
</div>
|
||||
<section class="home-div" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="section-content">
|
||||
<div class="reading-media">
|
||||
<div class="media-block">
|
||||
<a href="chapter_hello_algo/">
|
||||
<div style="height: 4.34%;">
|
||||
</div>
|
||||
<img alt="" class="device-on-hover" data-home-src="../assets/home/ad8bb1cc4c28091c/../shared/images/5b64cf7672ec5ec6/web_mac_iphone.webp" decoding="async" height="965" style="height: 66.31%;" width="1598"/>
|
||||
<noscript>
|
||||
<img alt="" class="device-on-hover" height="965" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/5b64cf7672ec5ec6/web_mac_iphone.webp" style="height: 66.31%;" width="1598"/>
|
||||
</noscript>
|
||||
<div style="height: 4.34%;">
|
||||
</div>
|
||||
<div class="text-button">
|
||||
<span>
|
||||
온라인으로 읽기
|
||||
</span>
|
||||
<svg viewbox="0 0 320 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z">
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="media-block">
|
||||
<a href="https://github.com/krahets/hello-algo/releases">
|
||||
<img alt="" class="device-on-hover" data-home-src="../assets/home/ad8bb1cc4c28091c/../shared/images/66baa2f9bf3abec7/pdf_ipad.webp" decoding="async" height="960" style="height: 75%;" width="812"/>
|
||||
<noscript>
|
||||
<img alt="" class="device-on-hover" height="960" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/66baa2f9bf3abec7/pdf_ipad.webp" style="height: 75%;" width="812"/>
|
||||
</noscript>
|
||||
<div class="text-button">
|
||||
<span>
|
||||
PDF/EPUB 제공 언어 확인
|
||||
</span>
|
||||
<svg viewbox="0 0 320 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z">
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<p style="margin-top: 2em;">
|
||||
500개의 애니메이션 그림, 14개 프로그래밍 언어의 코드, 3000개의 커뮤니티 질문과 답변으로 자료 구조와 알고리즘의 기초를 빠르게 익힐 수 있다
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Section: endorsements -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content">
|
||||
<h3 style="text-align: center; margin: 1em auto;">추천의 말</h3>
|
||||
<div class="intro-container endor-container">
|
||||
<div class="intro-text endor-text">
|
||||
<p style="margin-bottom: 0;">“쉽게 읽을 수 있는 자료 구조와 알고리즘 입문서다. 직접 실습하고 생각하며 배우도록 안내한다. 알고리즘 입문자에게 적극 추천한다.”</p>
|
||||
<p style="font-weight: bold;">—— 덩쥔후이, 칭화대학교 컴퓨터학과 교수</p>
|
||||
</div>
|
||||
<div class="intro-text endor-text">
|
||||
<p style="margin-bottom: 0;">“내가 자료 구조와 알고리즘을 배울 때 『Hello 알고리즘』이 있었다면 공부가 열 배는 쉬웠을 것이다!”</p>
|
||||
<p style="font-weight: bold;">—— 리무, 아마존 수석 과학자(Senior Principal Scientist)</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<section class="home-div" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="section-content">
|
||||
<h3 style="text-align: center; margin: 1em auto;">
|
||||
추천의 말
|
||||
</h3>
|
||||
<div class="intro-container endor-container">
|
||||
<div class="intro-text endor-text">
|
||||
<p style="margin-bottom: 0;">
|
||||
“쉽게 읽을 수 있는 자료 구조와 알고리즘 입문서다. 직접 실습하고 생각하며 배우도록 안내한다. 알고리즘 입문자에게 적극 추천한다.”
|
||||
</p>
|
||||
<p style="font-weight: bold;">
|
||||
—— 덩쥔후이, 칭화대학교 컴퓨터학과 교수
|
||||
</p>
|
||||
</div>
|
||||
<div class="intro-text endor-text">
|
||||
<p style="margin-bottom: 0;">
|
||||
“내가 자료 구조와 알고리즘을 배울 때 『Hello 알고리즘』이 있었다면 공부가 열 배는 쉬웠을 것이다!”
|
||||
</p>
|
||||
<p style="font-weight: bold;">
|
||||
—— 리무, 아마존 수석 과학자(Senior Principal Scientist)
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Section: features -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content">
|
||||
<div class="intro-container">
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="1.5em" width="1.5em" viewBox="0 0 640 512">
|
||||
<path fill="var(--md-primary-bg-color)" d="M256 0H576c35.3 0 64 28.7 64 64V288c0 35.3-28.7 64-64 64H256c-35.3 0-64-28.7-64-64V64c0-35.3 28.7-64 64-64zM476 106.7C471.5 100 464 96 456 96s-15.5 4-20 10.7l-56 84L362.7 169c-4.6-5.7-11.5-9-18.7-9s-14.2 3.3-18.7 9l-64 80c-5.8 7.2-6.9 17.1-2.9 25.4s12.4 13.6 21.6 13.6h80 48H552c8.9 0 17-4.9 21.2-12.7s3.7-17.3-1.2-24.6l-96-144zM336 96a32 32 0 1 0 -64 0 32 32 0 1 0 64 0zM64 128h96V384v32c0 17.7 14.3 32 32 32H320c17.7 0 32-14.3 32-32V384H512v64c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V192c0-35.3 28.7-64 64-64zm8 64c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V208c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V312c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H72zm336 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H424c-8.8 0-16 7.2-16 16z" />
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">애니메이션 그림</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">명확하고 이해하기 쉬운 내용, 완만한 학습 곡선</p>
|
||||
<p class="intro-quote">"A picture is worth a thousand words."<br>“그림 한 장이 천 마디 말보다 낫다”</p>
|
||||
</div>
|
||||
</div>
|
||||
<video class="intro-image" src="index.assets/animation.mp4" autoplay loop muted playsinline aria-label="애니메이션 예제"></video>
|
||||
</div>
|
||||
|
||||
<div class="intro-container">
|
||||
<video class="intro-image" src="index.assets/running_code.mp4" autoplay loop muted playsinline aria-label="코드 실행 예제"></video>
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="1.5em" width="1.5em" viewBox="0 0 640 512">
|
||||
<path fill="var(--md-primary-bg-color)" d="M392.8 1.2c-17-4.9-34.7 5-39.6 22l-128 448c-4.9 17 5 34.7 22 39.6s34.7-5 39.6-22l128-448c4.9-17-5-34.7-22-39.6zm80.6 120.1c-12.5 12.5-12.5 32.8 0 45.3L562.7 256l-89.4 89.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l112-112c12.5-12.5 12.5-32.8 0-45.3l-112-112c-12.5-12.5-32.8-12.5-45.3 0zm-306.7 0c-12.5-12.5-32.8-12.5-45.3 0l-112 112c-12.5 12.5-12.5 32.8 0 45.3l112 112c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256l89.4-89.4c12.5-12.5 12.5-32.8 0-45.3z" />
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">클릭 한 번으로 실행</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">열 가지가 넘는 프로그래밍 언어와 코드 실행 시각화</p>
|
||||
<p class="intro-quote">"Talk is cheap. Show me the code."<br>“말보다 코드를 보여 달라”</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="intro-container">
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="1.5em" width="1.5em" viewBox="0 0 640 512">
|
||||
<path fill="var(--md-primary-bg-color)" d="M88.2 309.1c9.8-18.3 6.8-40.8-7.5-55.8C59.4 230.9 48 204 48 176c0-63.5 63.8-128 160-128s160 64.5 160 128s-63.8 128-160 128c-13.1 0-25.8-1.3-37.8-3.6c-10.4-2-21.2-.6-30.7 4.2c-4.1 2.1-8.3 4.1-12.6 6c-16 7.2-32.9 13.5-49.9 18c2.8-4.6 5.4-9.1 7.9-13.6c1.1-1.9 2.2-3.9 3.2-5.9zM0 176c0 41.8 17.2 80.1 45.9 110.3c-.9 1.7-1.9 3.5-2.8 5.1c-10.3 18.4-22.3 36.5-36.6 52.1c-6.6 7-8.3 17.2-4.6 25.9C5.8 378.3 14.4 384 24 384c43 0 86.5-13.3 122.7-29.7c4.8-2.2 9.6-4.5 14.2-6.8c15.1 3 30.9 4.5 47.1 4.5c114.9 0 208-78.8 208-176S322.9 0 208 0S0 78.8 0 176zM432 480c16.2 0 31.9-1.6 47.1-4.5c4.6 2.3 9.4 4.6 14.2 6.8C529.5 498.7 573 512 616 512c9.6 0 18.2-5.7 22-14.5c3.8-8.8 2-19-4.6-25.9c-14.2-15.6-26.2-33.7-36.6-52.1c-.9-1.7-1.9-3.4-2.8-5.1C622.8 384.1 640 345.8 640 304c0-94.4-87.9-171.5-198.2-175.8c4.1 15.2 6.2 31.2 6.2 47.8l0 .6c87.2 6.7 144 67.5 144 127.4c0 28-11.4 54.9-32.7 77.2c-14.3 15-17.3 37.6-7.5 55.8c1.1 2 2.2 4 3.2 5.9c2.5 4.5 5.2 9 7.9 13.6c-17-4.5-33.9-10.7-49.9-18c-4.3-1.9-8.5-3.9-12.6-6c-9.5-4.8-20.3-6.2-30.7-4.2c-12.1 2.4-24.7 3.6-37.8 3.6c-61.7 0-110-26.5-136.8-62.3c-16 5.4-32.8 9.4-50 11.8C279 439.8 350 480 432 480z" />
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">함께 배우기</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">질문과 토론을 나누며 함께 성장하는 독자들</p>
|
||||
<p class="intro-quote">"Learning by teaching."<br>“가르치며 배운다”</p>
|
||||
</div>
|
||||
</div>
|
||||
<video class="intro-image" src="index.assets/comment.mp4" autoplay loop muted playsinline aria-label="댓글 예제"></video>
|
||||
</div>
|
||||
|
||||
<section class="home-div" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="section-content">
|
||||
<div class="intro-container">
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg height="1.5em" viewbox="0 0 640 512" width="1.5em" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M256 0H576c35.3 0 64 28.7 64 64V288c0 35.3-28.7 64-64 64H256c-35.3 0-64-28.7-64-64V64c0-35.3 28.7-64 64-64zM476 106.7C471.5 100 464 96 456 96s-15.5 4-20 10.7l-56 84L362.7 169c-4.6-5.7-11.5-9-18.7-9s-14.2 3.3-18.7 9l-64 80c-5.8 7.2-6.9 17.1-2.9 25.4s12.4 13.6 21.6 13.6h80 48H552c8.9 0 17-4.9 21.2-12.7s3.7-17.3-1.2-24.6l-96-144zM336 96a32 32 0 1 0 -64 0 32 32 0 1 0 64 0zM64 128h96V384v32c0 17.7 14.3 32 32 32H320c17.7 0 32-14.3 32-32V384H512v64c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V192c0-35.3 28.7-64 64-64zm8 64c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V208c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V312c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H72zm336 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H424c-8.8 0-16 7.2-16 16z" fill="var(--md-primary-bg-color)">
|
||||
</path>
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">
|
||||
애니메이션 그림
|
||||
</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">
|
||||
명확하고 이해하기 쉬운 내용, 완만한 학습 곡선
|
||||
</p>
|
||||
<p class="intro-quote">
|
||||
"A picture is worth a thousand words."
|
||||
<br/>
|
||||
“그림 한 장이 천 마디 말보다 낫다”
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Section: contributors -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content" style="max-width: 90vw;">
|
||||
<!-- author -->
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>저자</h3>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/krahets">
|
||||
<img class="profile-img" src="assets/avatar/avatar_yudongjin.jpg" alt="저자: yudongjin" />
|
||||
<br><b>진위둥(@krahets)</b>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- code reviewers -->
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>코드 검토자</h3>
|
||||
<p>다음 개발자들이 함께 힘을 모아 여러 언어의 예제 코드를 완성했다. 이들의 노력과 기여에 감사드린다!</p>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/coderonion">
|
||||
<img class="profile-img" src="assets/avatar/avatar_coderonion.jpg" alt="검토자: coderonion" />
|
||||
<br><b>coderonion</b>
|
||||
<br><sub>Zig, Rust</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/curtishd">
|
||||
<img class="profile-img" src="assets/avatar/avatar_curtishd.jpg" alt="검토자: curtishd" />
|
||||
<br><b>curtishd</b>
|
||||
<br><sub>Kotlin</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/Gonglja">
|
||||
<img class="profile-img" src="assets/avatar/avatar_Gonglja.jpg" alt="검토자: Gonglja" />
|
||||
<br><b>Gonglja</b>
|
||||
<br><sub>C, C++</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/gvenusleo">
|
||||
<img class="profile-img" src="assets/avatar/avatar_gvenusleo.jpg" alt="검토자: gvenusleo" />
|
||||
<br><b>gvenusleo</b>
|
||||
<br><sub>Dart</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/hpstory">
|
||||
<img class="profile-img" src="assets/avatar/avatar_hpstory.jpg" alt="검토자: hpstory" />
|
||||
<br><b>hpstory</b>
|
||||
<br><sub>C#</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/justin-tse">
|
||||
<img class="profile-img" src="assets/avatar/avatar_justin-tse.jpg" alt="검토자: justin-tse" />
|
||||
<br><b>justin-tse</b>
|
||||
<br><sub>JS, TS</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/khoaxuantu">
|
||||
<img class="profile-img" src="assets/avatar/avatar_khoaxuantu.jpg" alt="검토자: khoaxuantu" />
|
||||
<br><b>khoaxuantu</b>
|
||||
<br><sub>Ruby</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/krahets">
|
||||
<img class="profile-img" src="assets/avatar/avatar_krahets.jpg" alt="검토자: krahets" />
|
||||
<br><b>krahets</b>
|
||||
<br><sub>Python, Java</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/night-cruise">
|
||||
<img class="profile-img" src="assets/avatar/avatar_night-cruise.jpg" alt="검토자: night-cruise" />
|
||||
<br><b>night-cruise</b>
|
||||
<br><sub>Rust</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/nuomi1">
|
||||
<img class="profile-img" src="assets/avatar/avatar_nuomi1.jpg" alt="검토자: nuomi1" />
|
||||
<br><b>nuomi1</b>
|
||||
<br><sub>Swift</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/Reanon">
|
||||
<img class="profile-img" src="assets/avatar/avatar_Reanon.jpg" alt="검토자: Reanon" />
|
||||
<br><b>Reanon</b>
|
||||
<br><sub>Go, C</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/rongyi">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_rongyi.jpg" alt="검토자: rongyi" />
|
||||
<br><b>rongyi</b>
|
||||
<br><sub>Rust</sub>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- contributors -->
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>기여자</h3>
|
||||
<p>이 책은 오픈 소스 커뮤니티의 200명이 넘는 기여자가 함께 노력한 덕분에 꾸준히 발전하고 있다. 시간과 노력을 들여 준 모든 분께 감사드린다!</p>
|
||||
<a href="https://github.com/krahets/hello-algo/graphs/contributors">
|
||||
<img src="https://contrib.rocks/image?repo=krahets/hello-algo&max=300&columns=12" alt="기여자" style="width: 100%; max-width: 38.5em;">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<video aria-label="애니메이션 예제" class="intro-image" data-home-poster="../assets/home/ad8bb1cc4c28091c/../shared/images/9e5f39bf33afc70f/animation-poster.webp" data-home-video="../assets/home/ad8bb1cc4c28091c/../shared/media/6c70de2b2bf4eef7/animation.mp4" height="1080" loop="" muted="" playsinline="" preload="none" style="aspect-ratio: 1600 / 1080" width="1600">
|
||||
</video>
|
||||
<noscript>
|
||||
<a href="../assets/home/ad8bb1cc4c28091c/../shared/media/6c70de2b2bf4eef7/animation.mp4">
|
||||
<img alt="애니메이션 예제" class="intro-image" height="1080" src="../assets/home/ad8bb1cc4c28091c/../shared/images/9e5f39bf33afc70f/animation-poster.webp" width="1600"/>
|
||||
애니메이션 그림
|
||||
</a>
|
||||
</noscript>
|
||||
</div>
|
||||
<div class="intro-container">
|
||||
<video aria-label="코드 실행 예제" class="intro-image" data-home-poster="../assets/home/ad8bb1cc4c28091c/../shared/images/f33a13e8331245ae/running_code-poster.webp" data-home-video="../assets/home/ad8bb1cc4c28091c/../shared/media/bb169a96ca8316da/running_code.mp4" height="1082" loop="" muted="" playsinline="" preload="none" style="aspect-ratio: 1600 / 1082" width="1600">
|
||||
</video>
|
||||
<noscript>
|
||||
<a href="../assets/home/ad8bb1cc4c28091c/../shared/media/bb169a96ca8316da/running_code.mp4">
|
||||
<img alt="코드 실행 예제" class="intro-image" height="1082" src="../assets/home/ad8bb1cc4c28091c/../shared/images/f33a13e8331245ae/running_code-poster.webp" width="1600"/>
|
||||
클릭 한 번으로 실행
|
||||
</a>
|
||||
</noscript>
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg height="1.5em" viewbox="0 0 640 512" width="1.5em" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M392.8 1.2c-17-4.9-34.7 5-39.6 22l-128 448c-4.9 17 5 34.7 22 39.6s34.7-5 39.6-22l128-448c4.9-17-5-34.7-22-39.6zm80.6 120.1c-12.5 12.5-12.5 32.8 0 45.3L562.7 256l-89.4 89.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l112-112c12.5-12.5 12.5-32.8 0-45.3l-112-112c-12.5-12.5-32.8-12.5-45.3 0zm-306.7 0c-12.5-12.5-32.8-12.5-45.3 0l-112 112c-12.5 12.5-12.5 32.8 0 45.3l112 112c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256l89.4-89.4c12.5-12.5 12.5-32.8 0-45.3z" fill="var(--md-primary-bg-color)">
|
||||
</path>
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">
|
||||
클릭 한 번으로 실행
|
||||
</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">
|
||||
열 가지가 넘는 프로그래밍 언어와 코드 실행 시각화
|
||||
</p>
|
||||
<p class="intro-quote">
|
||||
"Talk is cheap. Show me the code."
|
||||
<br/>
|
||||
“말보다 코드를 보여 달라”
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="intro-container">
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg height="1.5em" viewbox="0 0 640 512" width="1.5em" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M88.2 309.1c9.8-18.3 6.8-40.8-7.5-55.8C59.4 230.9 48 204 48 176c0-63.5 63.8-128 160-128s160 64.5 160 128s-63.8 128-160 128c-13.1 0-25.8-1.3-37.8-3.6c-10.4-2-21.2-.6-30.7 4.2c-4.1 2.1-8.3 4.1-12.6 6c-16 7.2-32.9 13.5-49.9 18c2.8-4.6 5.4-9.1 7.9-13.6c1.1-1.9 2.2-3.9 3.2-5.9zM0 176c0 41.8 17.2 80.1 45.9 110.3c-.9 1.7-1.9 3.5-2.8 5.1c-10.3 18.4-22.3 36.5-36.6 52.1c-6.6 7-8.3 17.2-4.6 25.9C5.8 378.3 14.4 384 24 384c43 0 86.5-13.3 122.7-29.7c4.8-2.2 9.6-4.5 14.2-6.8c15.1 3 30.9 4.5 47.1 4.5c114.9 0 208-78.8 208-176S322.9 0 208 0S0 78.8 0 176zM432 480c16.2 0 31.9-1.6 47.1-4.5c4.6 2.3 9.4 4.6 14.2 6.8C529.5 498.7 573 512 616 512c9.6 0 18.2-5.7 22-14.5c3.8-8.8 2-19-4.6-25.9c-14.2-15.6-26.2-33.7-36.6-52.1c-.9-1.7-1.9-3.4-2.8-5.1C622.8 384.1 640 345.8 640 304c0-94.4-87.9-171.5-198.2-175.8c4.1 15.2 6.2 31.2 6.2 47.8l0 .6c87.2 6.7 144 67.5 144 127.4c0 28-11.4 54.9-32.7 77.2c-14.3 15-17.3 37.6-7.5 55.8c1.1 2 2.2 4 3.2 5.9c2.5 4.5 5.2 9 7.9 13.6c-17-4.5-33.9-10.7-49.9-18c-4.3-1.9-8.5-3.9-12.6-6c-9.5-4.8-20.3-6.2-30.7-4.2c-12.1 2.4-24.7 3.6-37.8 3.6c-61.7 0-110-26.5-136.8-62.3c-16 5.4-32.8 9.4-50 11.8C279 439.8 350 480 432 480z" fill="var(--md-primary-bg-color)">
|
||||
</path>
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">
|
||||
함께 배우기
|
||||
</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">
|
||||
질문과 토론을 나누며 함께 성장하는 독자들
|
||||
</p>
|
||||
<p class="intro-quote">
|
||||
"Learning by teaching."
|
||||
<br/>
|
||||
“가르치며 배운다”
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<video aria-label="댓글 예제" class="intro-image" data-home-poster="../assets/home/ad8bb1cc4c28091c/../shared/images/f9ac69536a7582f5/comment-poster.webp" data-home-video="../assets/home/ad8bb1cc4c28091c/../shared/media/62aa0b8d351c63a7/comment.mp4" height="1080" loop="" muted="" playsinline="" preload="none" style="aspect-ratio: 1600 / 1080" width="1600">
|
||||
</video>
|
||||
<noscript>
|
||||
<a href="../assets/home/ad8bb1cc4c28091c/../shared/media/62aa0b8d351c63a7/comment.mp4">
|
||||
<img alt="댓글 예제" class="intro-image" height="1080" src="../assets/home/ad8bb1cc4c28091c/../shared/images/f9ac69536a7582f5/comment-poster.webp" width="1600"/>
|
||||
함께 배우기
|
||||
</a>
|
||||
</noscript>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="home-div" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="section-content" style="max-width: 90vw;">
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>
|
||||
저자
|
||||
</h3>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/krahets">
|
||||
<img alt="저자: yudongjin" class="profile-img" height="512" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/02348410d40f7665/avatar_yudongjin.webp" width="512"/>
|
||||
<br/>
|
||||
<b>
|
||||
진위둥(@krahets)
|
||||
</b>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>
|
||||
코드 검토자
|
||||
</h3>
|
||||
<p>
|
||||
다음 개발자들이 함께 힘을 모아 여러 언어의 예제 코드를 완성했다. 이들의 노력과 기여에 감사드린다!
|
||||
</p>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/coderonion">
|
||||
<img alt="검토자: coderonion" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/db606f27971eae34/avatar_coderonion.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
coderonion
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Zig, Rust
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/curtishd">
|
||||
<img alt="검토자: curtishd" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/feedb0e547ea31fc/avatar_curtishd.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
curtishd
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Kotlin
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/Gonglja">
|
||||
<img alt="검토자: Gonglja" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/cdcf023b032b8d30/avatar_Gonglja.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
Gonglja
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
C, C++
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/gvenusleo">
|
||||
<img alt="검토자: gvenusleo" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/464e2d351b9263ec/avatar_gvenusleo.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
gvenusleo
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Dart
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/hpstory">
|
||||
<img alt="검토자: hpstory" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/7b6478acdab6b845/avatar_hpstory.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
hpstory
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
C#
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/justin-tse">
|
||||
<img alt="검토자: justin-tse" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/208ee5aae490eefa/avatar_justin-tse.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
justin-tse
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
JS, TS
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/khoaxuantu">
|
||||
<img alt="검토자: khoaxuantu" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/9d3f1a21ff51de78/avatar_khoaxuantu.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
khoaxuantu
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Ruby
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/krahets">
|
||||
<img alt="검토자: krahets" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/e321f9a3ac2739e0/avatar_krahets.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
krahets
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Python, Java
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/night-cruise">
|
||||
<img alt="검토자: night-cruise" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/960b489efa22abd4/avatar_night-cruise.jpg" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
night-cruise
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Rust
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/nuomi1">
|
||||
<img alt="검토자: nuomi1" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/7316a9eb4429b259/avatar_nuomi1.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
nuomi1
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Swift
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/Reanon">
|
||||
<img alt="검토자: Reanon" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/dcc15aa68cc793c7/avatar_Reanon.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
Reanon
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Go, C
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/rongyi">
|
||||
<img alt="검토자: rongyi" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/5dc6c4b1d8bfe0ac/avatar_rongyi.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
rongyi
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Rust
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>
|
||||
기여자
|
||||
</h3>
|
||||
<p>
|
||||
이 책은 오픈 소스 커뮤니티의 200명이 넘는 기여자가 함께 노력한 덕분에 꾸준히 발전하고 있다. 시간과 노력을 들여 준 모든 분께 감사드린다!
|
||||
</p>
|
||||
<a href="https://github.com/krahets/hello-algo/graphs/contributors">
|
||||
<img alt="기여자" loading="lazy" src="https://contrib.rocks/image?repo=krahets/hello-algo&max=300&columns=12" style="width: 100%; max-width: 38.5em;"/>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<!-- This independent fallback also works when the deferred loader cannot be fetched. -->
|
||||
<script defer="" onerror="document.querySelectorAll('[data-home-src], [data-home-poster]').forEach(function(el) { if (el.dataset.homeSrc) el.src = el.dataset.homeSrc; if (el.dataset.homePoster) el.poster = el.dataset.homePoster; });" src="../assets/home/ad8bb1cc4c28091c/javascripts/homepage-media.js">
|
||||
</script>
|
||||
|
||||
470
overrides/homepage/assets.json
Normal file
470
overrides/homepage/assets.json
Normal file
@@ -0,0 +1,470 @@
|
||||
{
|
||||
"assets": {
|
||||
"ground": {
|
||||
"source": "docs/assets/hero/ground.webp",
|
||||
"width": 881,
|
||||
"height": 380,
|
||||
"kind": "hero",
|
||||
"loading": "visible-layout"
|
||||
},
|
||||
"links": {
|
||||
"source": "docs/assets/hero/links.png",
|
||||
"width": 1562,
|
||||
"height": 1134,
|
||||
"kind": "hero",
|
||||
"loading": "visible-layout"
|
||||
},
|
||||
"astronaut": {
|
||||
"source": "docs/assets/hero/astronaut.webp",
|
||||
"width": 515,
|
||||
"height": 672,
|
||||
"kind": "hero",
|
||||
"loading": "visible-layout"
|
||||
},
|
||||
"chapter_computational_complexity": {
|
||||
"source": "docs/assets/hero/chapter_computational_complexity.png",
|
||||
"width": 113,
|
||||
"height": 178,
|
||||
"kind": "hero",
|
||||
"loading": "visible-layout"
|
||||
},
|
||||
"chapter_array_and_linkedlist": {
|
||||
"source": "docs/assets/hero/chapter_array_and_linkedlist.png",
|
||||
"width": 468,
|
||||
"height": 319,
|
||||
"kind": "hero",
|
||||
"loading": "visible-layout"
|
||||
},
|
||||
"chapter_stack_and_queue": {
|
||||
"source": "docs/assets/hero/chapter_stack_and_queue.png",
|
||||
"width": 204,
|
||||
"height": 204,
|
||||
"kind": "hero",
|
||||
"loading": "visible-layout"
|
||||
},
|
||||
"chapter_hashing": {
|
||||
"source": "docs/assets/hero/chapter_hashing.png",
|
||||
"width": 218,
|
||||
"height": 218,
|
||||
"kind": "hero",
|
||||
"loading": "visible-layout"
|
||||
},
|
||||
"chapter_tree": {
|
||||
"source": "docs/assets/hero/chapter_tree.png",
|
||||
"width": 280,
|
||||
"height": 281,
|
||||
"kind": "hero",
|
||||
"loading": "visible-layout"
|
||||
},
|
||||
"chapter_heap": {
|
||||
"source": "docs/assets/hero/chapter_heap.png",
|
||||
"width": 151,
|
||||
"height": 152,
|
||||
"kind": "hero",
|
||||
"loading": "visible-layout"
|
||||
},
|
||||
"chapter_graph": {
|
||||
"source": "docs/assets/hero/chapter_graph.png",
|
||||
"width": 542,
|
||||
"height": 272,
|
||||
"kind": "hero",
|
||||
"loading": "visible-layout"
|
||||
},
|
||||
"chapter_searching": {
|
||||
"source": "docs/assets/hero/chapter_searching.png",
|
||||
"width": 216,
|
||||
"height": 216,
|
||||
"kind": "hero",
|
||||
"loading": "visible-layout"
|
||||
},
|
||||
"chapter_sorting": {
|
||||
"source": "docs/assets/hero/chapter_sorting.png",
|
||||
"width": 138,
|
||||
"height": 137,
|
||||
"kind": "hero",
|
||||
"loading": "visible-layout"
|
||||
},
|
||||
"chapter_divide_and_conquer": {
|
||||
"source": "docs/assets/hero/chapter_divide_and_conquer.png",
|
||||
"width": 407,
|
||||
"height": 269,
|
||||
"kind": "hero",
|
||||
"loading": "visible-layout"
|
||||
},
|
||||
"chapter_backtracking": {
|
||||
"source": "docs/assets/hero/chapter_backtracking.png",
|
||||
"width": 345,
|
||||
"height": 249,
|
||||
"kind": "hero",
|
||||
"loading": "visible-layout"
|
||||
},
|
||||
"chapter_dynamic_programming": {
|
||||
"source": "docs/assets/hero/chapter_dynamic_programming.png",
|
||||
"width": 267,
|
||||
"height": 268,
|
||||
"kind": "hero",
|
||||
"loading": "visible-layout"
|
||||
},
|
||||
"chapter_greedy": {
|
||||
"source": "docs/assets/hero/chapter_greedy.png",
|
||||
"width": 265,
|
||||
"height": 202,
|
||||
"kind": "hero",
|
||||
"loading": "visible-layout"
|
||||
},
|
||||
"cover_render": {
|
||||
"source": "docs/assets/hero/cover_render.png",
|
||||
"width": 535,
|
||||
"height": 720,
|
||||
"kind": "image",
|
||||
"loading": "lazy"
|
||||
},
|
||||
"web_mac_iphone": {
|
||||
"source": "docs/assets/hero/web_mac_iphone.png",
|
||||
"width": 1598,
|
||||
"height": 965,
|
||||
"kind": "image",
|
||||
"loading": "lazy"
|
||||
},
|
||||
"pdf_ipad": {
|
||||
"source": "docs/assets/hero/pdf_ipad.png",
|
||||
"width": 812,
|
||||
"height": 960,
|
||||
"kind": "image",
|
||||
"loading": "lazy"
|
||||
},
|
||||
"animation": {
|
||||
"source": "docs/index.assets/animation.mp4",
|
||||
"kind": "video",
|
||||
"loading": "near-viewport-static-in-reduced-motion"
|
||||
},
|
||||
"running_code": {
|
||||
"source": "docs/index.assets/running_code.mp4",
|
||||
"kind": "video",
|
||||
"loading": "near-viewport-static-in-reduced-motion"
|
||||
},
|
||||
"comment": {
|
||||
"source": "docs/index.assets/comment.mp4",
|
||||
"kind": "video",
|
||||
"loading": "near-viewport-static-in-reduced-motion"
|
||||
},
|
||||
"avatar_yudongjin": {
|
||||
"source": "docs/assets/avatar/avatar_yudongjin.jpg",
|
||||
"width": 512,
|
||||
"height": 512,
|
||||
"kind": "image",
|
||||
"loading": "lazy"
|
||||
},
|
||||
"avatar_coderonion": {
|
||||
"source": "docs/assets/avatar/avatar_coderonion.jpg",
|
||||
"width": 384,
|
||||
"height": 384,
|
||||
"kind": "image",
|
||||
"loading": "lazy"
|
||||
},
|
||||
"avatar_curtishd": {
|
||||
"source": "docs/assets/avatar/avatar_curtishd.jpg",
|
||||
"width": 384,
|
||||
"height": 384,
|
||||
"kind": "image",
|
||||
"loading": "lazy"
|
||||
},
|
||||
"avatar_Gonglja": {
|
||||
"source": "docs/assets/avatar/avatar_Gonglja.jpg",
|
||||
"width": 384,
|
||||
"height": 384,
|
||||
"kind": "image",
|
||||
"loading": "lazy"
|
||||
},
|
||||
"avatar_gvenusleo": {
|
||||
"source": "docs/assets/avatar/avatar_gvenusleo.jpg",
|
||||
"width": 384,
|
||||
"height": 384,
|
||||
"kind": "image",
|
||||
"loading": "lazy"
|
||||
},
|
||||
"avatar_hpstory": {
|
||||
"source": "docs/assets/avatar/avatar_hpstory.jpg",
|
||||
"width": 384,
|
||||
"height": 384,
|
||||
"kind": "image",
|
||||
"loading": "lazy"
|
||||
},
|
||||
"avatar_justin-tse": {
|
||||
"source": "docs/assets/avatar/avatar_justin-tse.jpg",
|
||||
"width": 384,
|
||||
"height": 384,
|
||||
"kind": "image",
|
||||
"loading": "lazy"
|
||||
},
|
||||
"avatar_khoaxuantu": {
|
||||
"source": "docs/assets/avatar/avatar_khoaxuantu.jpg",
|
||||
"width": 384,
|
||||
"height": 384,
|
||||
"kind": "image",
|
||||
"loading": "lazy"
|
||||
},
|
||||
"avatar_krahets": {
|
||||
"source": "docs/assets/avatar/avatar_krahets.jpg",
|
||||
"width": 384,
|
||||
"height": 384,
|
||||
"kind": "image",
|
||||
"loading": "lazy"
|
||||
},
|
||||
"avatar_night-cruise": {
|
||||
"source": "docs/assets/avatar/avatar_night-cruise.jpg",
|
||||
"width": 384,
|
||||
"height": 384,
|
||||
"kind": "image",
|
||||
"loading": "lazy"
|
||||
},
|
||||
"avatar_nuomi1": {
|
||||
"source": "docs/assets/avatar/avatar_nuomi1.jpg",
|
||||
"width": 384,
|
||||
"height": 384,
|
||||
"kind": "image",
|
||||
"loading": "lazy"
|
||||
},
|
||||
"avatar_Reanon": {
|
||||
"source": "docs/assets/avatar/avatar_Reanon.jpg",
|
||||
"width": 384,
|
||||
"height": 384,
|
||||
"kind": "image",
|
||||
"loading": "lazy"
|
||||
},
|
||||
"avatar_rongyi": {
|
||||
"source": "docs/assets/avatar/avatar_rongyi.jpg",
|
||||
"width": 384,
|
||||
"height": 384,
|
||||
"kind": "image",
|
||||
"loading": "lazy"
|
||||
},
|
||||
"avatar_Shyam-Chen": {
|
||||
"source": "docs/assets/avatar/avatar_Shyam-Chen.jpg",
|
||||
"width": 384,
|
||||
"height": 384,
|
||||
"kind": "image",
|
||||
"loading": "lazy"
|
||||
},
|
||||
"avatar_Dr-XYZ": {
|
||||
"source": "docs/assets/avatar/avatar_Dr-XYZ.jpg",
|
||||
"width": 384,
|
||||
"height": 384,
|
||||
"kind": "image",
|
||||
"loading": "lazy"
|
||||
},
|
||||
"en_animation": {
|
||||
"source": "en/docs/index.assets/animation.mp4",
|
||||
"kind": "video",
|
||||
"loading": "near-viewport-static-in-reduced-motion"
|
||||
},
|
||||
"en_running_code": {
|
||||
"source": "en/docs/index.assets/running_code.mp4",
|
||||
"kind": "video",
|
||||
"loading": "near-viewport-static-in-reduced-motion"
|
||||
},
|
||||
"en_comment": {
|
||||
"source": "en/docs/index.assets/comment.mp4",
|
||||
"kind": "video",
|
||||
"loading": "near-viewport-static-in-reduced-motion"
|
||||
},
|
||||
"avatar_shevkun": {
|
||||
"source": "docs/assets/avatar/avatar_shevkun.jpg",
|
||||
"width": 384,
|
||||
"height": 384,
|
||||
"kind": "image",
|
||||
"loading": "lazy"
|
||||
},
|
||||
"avatar_yuyanhuang": {
|
||||
"source": "docs/assets/avatar/avatar_yuyanhuang.jpg",
|
||||
"width": 512,
|
||||
"height": 512,
|
||||
"kind": "image",
|
||||
"loading": "lazy"
|
||||
}
|
||||
},
|
||||
"objects": [
|
||||
{
|
||||
"id": "ground",
|
||||
"style": "position: absolute; width: auto; height: 26.445%; left: 28.211%; top: 54.145%;",
|
||||
"href": null,
|
||||
"label_style": null
|
||||
},
|
||||
{
|
||||
"id": "links",
|
||||
"style": "position: absolute; width: auto; height: 78.751%; left: 10.545%; top: 7.326%;",
|
||||
"href": null,
|
||||
"label_style": null
|
||||
},
|
||||
{
|
||||
"id": "astronaut",
|
||||
"style": "height: 46.673%; left: 35.413%; top: 24.343%;",
|
||||
"href": "chapter_introduction/",
|
||||
"label_style": "left: 52.244%; top: 20.919%;"
|
||||
},
|
||||
{
|
||||
"id": "chapter_computational_complexity",
|
||||
"style": "height: 12.347%; left: 36.267%; top: 37.653%;",
|
||||
"href": "chapter_computational_complexity/",
|
||||
"label_style": "left: 39.244%; top: 33.919%;"
|
||||
},
|
||||
{
|
||||
"id": "chapter_array_and_linkedlist",
|
||||
"style": "height: 22.242%; left: 73.242%; top: 52.481%;",
|
||||
"href": "chapter_array_and_linkedlist/",
|
||||
"label_style": "left: 90.897%; top: 76.259%;"
|
||||
},
|
||||
{
|
||||
"id": "chapter_stack_and_queue",
|
||||
"style": "height: 14.302%; left: 62.646%; top: 77.875%;",
|
||||
"href": "chapter_stack_and_queue/",
|
||||
"label_style": "left: 77.571%; top: 91.25%;"
|
||||
},
|
||||
{
|
||||
"id": "chapter_hashing",
|
||||
"style": "height: 15.266%; left: 63.281%; top: 27.933%;",
|
||||
"href": "chapter_hashing/",
|
||||
"label_style": "left: 68.862%; top: 46.292%;"
|
||||
},
|
||||
{
|
||||
"id": "chapter_tree",
|
||||
"style": "height: 19.615%; left: 80.137%; top: 26.678%;",
|
||||
"href": "chapter_tree/",
|
||||
"label_style": "left: 96.159%; top: 44.8%;"
|
||||
},
|
||||
{
|
||||
"id": "chapter_heap",
|
||||
"style": "height: 10.566%; left: 77.226%; top: 11.559%;",
|
||||
"href": "chapter_heap/",
|
||||
"label_style": "left: 88.103%; top: 15.422%;"
|
||||
},
|
||||
{
|
||||
"id": "chapter_graph",
|
||||
"style": "height: 16.112%; left: 51.854%; top: 5.575%;",
|
||||
"href": "chapter_graph/",
|
||||
"label_style": "left: 71.195%; top: 6.503%;"
|
||||
},
|
||||
{
|
||||
"id": "chapter_searching",
|
||||
"style": "height: 15.149%; left: 18.185%; top: 16.404%;",
|
||||
"href": "chapter_searching/",
|
||||
"label_style": "left: 14.556%; top: 20.876%;"
|
||||
},
|
||||
{
|
||||
"id": "chapter_sorting",
|
||||
"style": "height: 9.574%; left: 25.409%; top: 40.747%;",
|
||||
"href": "chapter_sorting/",
|
||||
"label_style": "left: 28.805%; top: 53.808%;"
|
||||
},
|
||||
{
|
||||
"id": "chapter_divide_and_conquer",
|
||||
"style": "height: 18.681%; left: 32.721%; top: 4.816%;",
|
||||
"href": "chapter_divide_and_conquer/",
|
||||
"label_style": "left: 31.42%; top: 8.679%;"
|
||||
},
|
||||
{
|
||||
"id": "chapter_backtracking",
|
||||
"style": "height: 17.338%; left: 4.875%; top: 32.925%;",
|
||||
"href": "chapter_backtracking/",
|
||||
"label_style": "left: 4.742%; top: 50.113%;"
|
||||
},
|
||||
{
|
||||
"id": "chapter_dynamic_programming",
|
||||
"style": "height: 15.47%; left: 9.406%; top: 57.472%;",
|
||||
"href": "chapter_dynamic_programming/",
|
||||
"label_style": "left: 8.561%; top: 75.351%;"
|
||||
},
|
||||
{
|
||||
"id": "chapter_greedy",
|
||||
"style": "height: 14.127%; left: 23.132%; top: 75.803%;",
|
||||
"href": "chapter_greedy/",
|
||||
"label_style": "left: 21.619%; top: 86.85%;"
|
||||
}
|
||||
],
|
||||
"textures": {
|
||||
"array_and_linkedlist": {
|
||||
"source": "overrides/javascripts/hero-textures/array_and_linkedlist-albedo.webp",
|
||||
"width": 1024,
|
||||
"height": 512
|
||||
},
|
||||
"backtracking": {
|
||||
"source": "overrides/javascripts/hero-textures/backtracking-albedo.webp",
|
||||
"width": 1024,
|
||||
"height": 512
|
||||
},
|
||||
"divide_and_conquer": {
|
||||
"source": "overrides/javascripts/hero-textures/divide_and_conquer-albedo.webp",
|
||||
"width": 1024,
|
||||
"height": 512
|
||||
},
|
||||
"dynamic_programming": {
|
||||
"source": "overrides/javascripts/hero-textures/dynamic_programming-albedo.webp",
|
||||
"width": 1024,
|
||||
"height": 512
|
||||
},
|
||||
"graph": {
|
||||
"source": "overrides/javascripts/hero-textures/graph-albedo.webp",
|
||||
"width": 1024,
|
||||
"height": 512
|
||||
},
|
||||
"greedy": {
|
||||
"source": "overrides/javascripts/hero-textures/greedy-albedo.webp",
|
||||
"width": 1024,
|
||||
"height": 512
|
||||
},
|
||||
"hashing": {
|
||||
"source": "overrides/javascripts/hero-textures/hashing-albedo.webp",
|
||||
"width": 1024,
|
||||
"height": 512
|
||||
},
|
||||
"heap": {
|
||||
"source": "overrides/javascripts/hero-textures/heap-albedo.webp",
|
||||
"width": 1024,
|
||||
"height": 512
|
||||
},
|
||||
"moon": {
|
||||
"source": "overrides/javascripts/hero-textures/moon-albedo.webp",
|
||||
"width": 1024,
|
||||
"height": 512
|
||||
},
|
||||
"searching": {
|
||||
"source": "overrides/javascripts/hero-textures/searching-albedo.webp",
|
||||
"width": 1024,
|
||||
"height": 512
|
||||
},
|
||||
"sorting": {
|
||||
"source": "overrides/javascripts/hero-textures/sorting-albedo.webp",
|
||||
"width": 1024,
|
||||
"height": 512
|
||||
},
|
||||
"stack_and_queue": {
|
||||
"source": "overrides/javascripts/hero-textures/stack_and_queue-albedo.webp",
|
||||
"width": 1024,
|
||||
"height": 512
|
||||
},
|
||||
"tree": {
|
||||
"source": "overrides/javascripts/hero-textures/tree-albedo.webp",
|
||||
"width": 1024,
|
||||
"height": 512
|
||||
}
|
||||
},
|
||||
"runtime": {
|
||||
"starfield.js": "overrides/javascripts/starfield.js",
|
||||
"hero-planets.js": "overrides/javascripts/hero-planets.js",
|
||||
"hero-surfaces.js": "overrides/javascripts/hero-surfaces.js",
|
||||
"hero-hourglass.js": "overrides/javascripts/hero-hourglass.js",
|
||||
"homepage-media.js": "overrides/javascripts/homepage-media.js",
|
||||
"hero-motion.css": "overrides/stylesheets/hero-motion.css",
|
||||
"vendor/three/three.module.min.js": "overrides/javascripts/vendor/three/three.module.min.js",
|
||||
"vendor/three/LICENSE": "overrides/javascripts/vendor/three/LICENSE",
|
||||
"vendor/three/package.json": "overrides/javascripts/vendor/three/package.json",
|
||||
"vendor/three/three.core.min.js": "overrides/javascripts/vendor/three/three.core.min.js",
|
||||
"hero-paint-seams.js": "overrides/javascripts/hero-paint-seams.js"
|
||||
},
|
||||
"encoding": {
|
||||
"hero_quality": 75,
|
||||
"image_quality": 75,
|
||||
"texture_quality": 75,
|
||||
"poster_quality": 75
|
||||
}
|
||||
}
|
||||
22
overrides/homepage/icons.html.j2
Normal file
22
overrides/homepage/icons.html.j2
Normal file
@@ -0,0 +1,22 @@
|
||||
{% macro read() %}<svg viewbox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
|
||||
<path d="M160 96a96 96 0 1 1 192 0A96 96 0 1 1 160 96zm80 152V512l-48.4-24.2c-20.9-10.4-43.5-17-66.8-19.3l-96-9.6C12.5 457.2 0 443.5 0 427V224c0-17.7 14.3-32 32-32H62.3c63.6 0 125.6 19.6 177.7 56zm32 264V248c52.1-36.4 114.1-56 177.7-56H480c17.7 0 32 14.3 32 32V427c0 16.4-12.5 30.2-28.8 31.8l-96 9.6c-23.2 2.3-45.9 8.9-66.8 19.3L272 512z"></path>
|
||||
</svg>{% endmacro %}
|
||||
{% macro github() %}<svg viewbox="0 0 496 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3 .3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5 .3-6.2 2.3zm44.2-1.7c-2.9 .7-4.9 2.6-4.6 4.9 .3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3 .7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3 .3 2.9 2.3 3.9 1.6 1 3.6 .7 4.3-.7 .7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3 .7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3 .7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z">
|
||||
</path>
|
||||
</svg>{% endmacro %}
|
||||
{% macro arrow() %}<svg fill="var(--md-default-fg-color)" height="2vh" viewbox="0 0 384 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M169.4 470.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 370.8 224 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 306.7L54.6 265.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z"></path>
|
||||
</svg>{% endmacro %}
|
||||
{% macro chevron() %}<svg viewbox="0 0 320 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z"></path>
|
||||
</svg>{% endmacro %}
|
||||
{% macro feature_0() %}<svg height="1.5em" viewbox="0 0 640 512" width="1.5em" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M256 0H576c35.3 0 64 28.7 64 64V288c0 35.3-28.7 64-64 64H256c-35.3 0-64-28.7-64-64V64c0-35.3 28.7-64 64-64zM476 106.7C471.5 100 464 96 456 96s-15.5 4-20 10.7l-56 84L362.7 169c-4.6-5.7-11.5-9-18.7-9s-14.2 3.3-18.7 9l-64 80c-5.8 7.2-6.9 17.1-2.9 25.4s12.4 13.6 21.6 13.6h80 48H552c8.9 0 17-4.9 21.2-12.7s3.7-17.3-1.2-24.6l-96-144zM336 96a32 32 0 1 0 -64 0 32 32 0 1 0 64 0zM64 128h96V384v32c0 17.7 14.3 32 32 32H320c17.7 0 32-14.3 32-32V384H512v64c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V192c0-35.3 28.7-64 64-64zm8 64c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V208c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V312c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H72zm336 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H424c-8.8 0-16 7.2-16 16z" fill="var(--md-primary-bg-color)"></path>
|
||||
</svg>{% endmacro %}
|
||||
{% macro feature_1() %}<svg height="1.5em" viewbox="0 0 640 512" width="1.5em" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M392.8 1.2c-17-4.9-34.7 5-39.6 22l-128 448c-4.9 17 5 34.7 22 39.6s34.7-5 39.6-22l128-448c4.9-17-5-34.7-22-39.6zm80.6 120.1c-12.5 12.5-12.5 32.8 0 45.3L562.7 256l-89.4 89.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l112-112c12.5-12.5 12.5-32.8 0-45.3l-112-112c-12.5-12.5-32.8-12.5-45.3 0zm-306.7 0c-12.5-12.5-32.8-12.5-45.3 0l-112 112c-12.5 12.5-12.5 32.8 0 45.3l112 112c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256l89.4-89.4c12.5-12.5 12.5-32.8 0-45.3z" fill="var(--md-primary-bg-color)"></path>
|
||||
</svg>{% endmacro %}
|
||||
{% macro feature_2() %}<svg height="1.5em" viewbox="0 0 640 512" width="1.5em" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M88.2 309.1c9.8-18.3 6.8-40.8-7.5-55.8C59.4 230.9 48 204 48 176c0-63.5 63.8-128 160-128s160 64.5 160 128s-63.8 128-160 128c-13.1 0-25.8-1.3-37.8-3.6c-10.4-2-21.2-.6-30.7 4.2c-4.1 2.1-8.3 4.1-12.6 6c-16 7.2-32.9 13.5-49.9 18c2.8-4.6 5.4-9.1 7.9-13.6c1.1-1.9 2.2-3.9 3.2-5.9zM0 176c0 41.8 17.2 80.1 45.9 110.3c-.9 1.7-1.9 3.5-2.8 5.1c-10.3 18.4-22.3 36.5-36.6 52.1c-6.6 7-8.3 17.2-4.6 25.9C5.8 378.3 14.4 384 24 384c43 0 86.5-13.3 122.7-29.7c4.8-2.2 9.6-4.5 14.2-6.8c15.1 3 30.9 4.5 47.1 4.5c114.9 0 208-78.8 208-176S322.9 0 208 0S0 78.8 0 176zM432 480c16.2 0 31.9-1.6 47.1-4.5c4.6 2.3 9.4 4.6 14.2 6.8C529.5 498.7 573 512 616 512c9.6 0 18.2-5.7 22-14.5c3.8-8.8 2-19-4.6-25.9c-14.2-15.6-26.2-33.7-36.6-52.1c-.9-1.7-1.9-3.4-2.8-5.1C622.8 384.1 640 345.8 640 304c0-94.4-87.9-171.5-198.2-175.8c4.1 15.2 6.2 31.2 6.2 47.8l0 .6c87.2 6.7 144 67.5 144 127.4c0 28-11.4 54.9-32.7 77.2c-14.3 15-17.3 37.6-7.5 55.8c1.1 2 2.2 4 3.2 5.9c2.5 4.5 5.2 9 7.9 13.6c-17-4.5-33.9-10.7-49.9-18c-4.3-1.9-8.5-3.9-12.6-6c-9.5-4.8-20.3-6.2-30.7-4.2c-12.1 2.4-24.7 3.6-37.8 3.6c-61.7 0-110-26.5-136.8-62.3c-16 5.4-32.8 9.4-50 11.8C279 439.8 350 480 432 480z" fill="var(--md-primary-bg-color)"></path>
|
||||
</svg>{% endmacro %}
|
||||
91
overrides/homepage/index.html.j2
Normal file
91
overrides/homepage/index.html.j2
Normal file
@@ -0,0 +1,91 @@
|
||||
{% import 'icons.html.j2' as icons %}
|
||||
<!-- Generated from the shared homepage template and locale configuration. -->
|
||||
<link rel="stylesheet" href="{{ runtime('hero-motion.css') }}">
|
||||
<noscript><style>[data-home-src], video[data-home-poster] { display: none; }</style></noscript>
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div home-universe-bg">
|
||||
<div class="starfield"><div class="starfield-origin"></div></div>
|
||||
<div class="{{ locale.hero_class }}" data-home-layout="{{ 'list' if locale.list_layout else 'universe' }}">
|
||||
{% for object in objects %}
|
||||
{% if object.href %}<a href="{{ object.href }}">{% endif %}
|
||||
<img {{ hero_image(object.id)|safe }} alt="" style="{{ object.style }}">
|
||||
{% if object.href %}<span style="{{ locale.label_styles[object.id] }}">{{ locale.labels[object.id] }}</span></a>{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
<div class="heading-div">
|
||||
<img style="{{ locale.typing.style }}" src="{{ locale.typing.src }}" alt="{{ locale.typing.alt }}" loading="lazy">
|
||||
<div style="pointer-events: auto;">
|
||||
<p style="margin-top: max(-1vh, -2vw); margin-bottom: min(2vh, 3.5vw);">{{ locale.tagline }}</p>
|
||||
<a href="{{ locale.start_href }}" class="rounded-button">{{ icons.read() }}<span>{{ locale.start_label }}</span></a>
|
||||
<a href="https://github.com/krahets/hello-algo" class="rounded-button">{{ icons.github() }}<span>GitHub</span></a>
|
||||
</div>
|
||||
<div style="text-align: center; margin-top: min(2.5vh, 3.5vw);">{{ icons.arrow() }}</div>
|
||||
</div>
|
||||
</section>
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content">
|
||||
<div class="reading-media">
|
||||
{% for card in locale.reading %}
|
||||
<div class="media-block"><a href="{{ card.href }}">
|
||||
{% if card.spacers %}<div style="{{ card.spacers[0] }}"></div>{% endif %}
|
||||
<img class="device-on-hover" style="{{ card.image_style }}" {{ image(card.asset, true)|safe }} alt="{{ card.alt }}" decoding="async">
|
||||
<noscript><img class="device-on-hover" style="{{ card.image_style }}" {{ image(card.asset)|safe }} alt="{{ card.alt }}" loading="lazy"></noscript>
|
||||
{% if card.spacers|length > 1 %}<div style="{{ card.spacers[1] }}"></div>{% endif %}
|
||||
<div class="text-button"><span>{{ card.label }}</span>{{ icons.chevron() }}</div>
|
||||
</a></div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% for note in locale.reading_notes %}<p style="{{ note.style }}">{{ note.text }}</p>{% endfor %}
|
||||
<p style="margin-top: 2em;">{{ locale.reading_description }}</p>
|
||||
</div>
|
||||
</section>
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content">
|
||||
<h3 style="text-align: center; margin: 1em auto;">{{ locale.endorsement_title }}</h3>
|
||||
<div class="intro-container endor-container">
|
||||
{% for quote, author in locale.endorsements %}
|
||||
<div class="intro-text endor-text"><p style="margin-bottom: 0;">{{ quote }}</p><p style="font-weight: bold;">{{ author }}</p></div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{% macro feature_text(feature, i) %}
|
||||
<div class="intro-text"><div>
|
||||
<div style="display: flex; align-items: center;">{{ icons['feature_' ~ i]() }}<h3 style="margin-left: 0.5em;">{{ feature.title }}</h3></div>
|
||||
<p style="margin: 0;">{{ feature.description }}</p>
|
||||
<p class="intro-quote">{% for line in feature.quotes %}{{ line }}{% if not loop.last %}<br>{% endif %}{% endfor %}</p>
|
||||
</div></div>
|
||||
{% endmacro %}
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content">
|
||||
{% for feature in locale.features %}
|
||||
<div class="intro-container">
|
||||
{% if loop.index0 != 1 %}{{ feature_text(feature, loop.index0) }}{% endif %}
|
||||
<video class="intro-image" style="aspect-ratio: {{ assets[feature.video].width }} / {{ assets[feature.video].height }}" data-home-video="{{ asset_url(feature.video) }}" data-home-poster="{{ poster_url(feature.video) }}" preload="none" loop muted playsinline aria-label="{{ feature.video_label }}" width="{{ assets[feature.video].width }}" height="{{ assets[feature.video].height }}"></video>
|
||||
<noscript><a href="{{ asset_url(feature.video) }}"><img class="intro-image" src="{{ poster_url(feature.video) }}" width="{{ assets[feature.video].width }}" height="{{ assets[feature.video].height }}" alt="{{ feature.video_label }}">{{ feature.title }}</a></noscript>
|
||||
{% if loop.index0 == 1 %}{{ feature_text(feature, loop.index0) }}{% endif %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</section>
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content" style="max-width: 90vw;">
|
||||
{% for group in locale.people %}
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>{{ group.title }}</h3>
|
||||
{% if group.description %}<p>{{ group.description }}</p>{% endif %}
|
||||
{% if group.profiles %}<div class="profile-div">
|
||||
{% for person in group.profiles %}
|
||||
<div class="{{ person.class }}">
|
||||
{% if person.href %}<a href="{{ person.href }}">{% endif %}
|
||||
<img class="profile-img" {{ image(person.asset)|safe }} alt="{{ person.alt }}" loading="lazy">
|
||||
<br><b>{{ person.name }}</b>{% if person.detail %}<br><sub>{{ person.detail }}</sub>{% endif %}
|
||||
{% if person.href %}</a>{% endif %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>{% else %}<a href="{{ group.banner.href }}"><img src="{{ group.banner.url }}" alt="{{ group.banner.alt }}" style="{{ group.banner.style }}" loading="lazy"></a>{% endif %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</section>
|
||||
<!-- This independent fallback also works when the deferred loader cannot be fetched. -->
|
||||
<script src="{{ runtime('homepage-media.js') }}" defer onerror="document.querySelectorAll('[data-home-src], [data-home-poster]').forEach(function(el) { if (el.dataset.homeSrc) el.src = el.dataset.homeSrc; if (el.dataset.homePoster) el.poster = el.dataset.homePoster; });"></script>
|
||||
236
overrides/homepage/locales/en.json
Normal file
236
overrides/homepage/locales/en.json
Normal file
@@ -0,0 +1,236 @@
|
||||
{
|
||||
"hero_class": "hero-div hero-div--en",
|
||||
"list_layout": true,
|
||||
"labels": {
|
||||
"astronaut": "Getting to know algorithms",
|
||||
"chapter_computational_complexity": "Complexity",
|
||||
"chapter_array_and_linkedlist": "Arrays and linked lists",
|
||||
"chapter_stack_and_queue": "Stacks and queues",
|
||||
"chapter_hashing": "Hash tables",
|
||||
"chapter_tree": "Trees",
|
||||
"chapter_heap": "Heaps",
|
||||
"chapter_graph": "Graphs",
|
||||
"chapter_searching": "Searching",
|
||||
"chapter_sorting": "Sorting",
|
||||
"chapter_divide_and_conquer": "Divide and conquer",
|
||||
"chapter_backtracking": "Backtracking",
|
||||
"chapter_dynamic_programming": "Dynamic programming",
|
||||
"chapter_greedy": "Greedy algorithms"
|
||||
},
|
||||
"label_styles": {
|
||||
"astronaut": "left: 52.244%; top: 20.919%;",
|
||||
"chapter_computational_complexity": "left: 39.244%; top: 33.919%;",
|
||||
"chapter_array_and_linkedlist": "left: 90.897%; top: 76.259%;",
|
||||
"chapter_stack_and_queue": "left: 77.571%; top: 91.25%;",
|
||||
"chapter_hashing": "left: 68.862%; top: 46.292%;",
|
||||
"chapter_tree": "left: 96.159%; top: 44.8%;",
|
||||
"chapter_heap": "left: 88.103%; top: 15.422%;",
|
||||
"chapter_graph": "left: 71.195%; top: 6.503%;",
|
||||
"chapter_searching": "left: 14.556%; top: 20.876%;",
|
||||
"chapter_sorting": "left: 28.805%; top: 53.808%;",
|
||||
"chapter_divide_and_conquer": "left: 31.42%; top: 8.679%;",
|
||||
"chapter_backtracking": "left: 4.742%; top: 50.113%;",
|
||||
"chapter_dynamic_programming": "left: 8.561%; top: 75.351%;",
|
||||
"chapter_greedy": "left: 21.619%; top: 86.85%;"
|
||||
},
|
||||
"typing": {
|
||||
"style": "height: min(9vh, 12vw);",
|
||||
"src": "https://readme-typing-svg.demolab.com/?font=Noto+Sans&weight=400&duration=3500&pause=2000&color=FFF¢er=true&vCenter=true&random=false&width=200&lines=Hello%2C+Algo+!",
|
||||
"alt": ""
|
||||
},
|
||||
"tagline": "A data structures and algorithms tutorial with animated illustrations and code you can run with one click",
|
||||
"start_label": "Start reading",
|
||||
"start_href": "chapter_hello_algo/",
|
||||
"reading": [
|
||||
{
|
||||
"asset": "web_mac_iphone",
|
||||
"href": "chapter_hello_algo/",
|
||||
"alt": "Web reading on a computer and phone",
|
||||
"label": "Read online",
|
||||
"image_style": "height: 66.31%;",
|
||||
"spacers": [
|
||||
"height: 4.34%;",
|
||||
"height: 4.34%;"
|
||||
]
|
||||
},
|
||||
{
|
||||
"asset": "pdf_ipad",
|
||||
"href": "https://github.com/krahets/hello-algo/releases",
|
||||
"alt": "PDF reading on a tablet",
|
||||
"label": "Download PDF/EPUB",
|
||||
"image_style": "height: 75%;",
|
||||
"spacers": []
|
||||
}
|
||||
],
|
||||
"reading_description": "Get started with data structures and algorithms through 500 animated illustrations, code in 14 programming languages, and 3,000 community questions and answers",
|
||||
"endorsement_title": "Endorsements",
|
||||
"endorsements": [
|
||||
[
|
||||
"“An accessible introduction to data structures and algorithms that encourages readers to learn by thinking and doing. Highly recommended for anyone new to algorithms.”",
|
||||
"— Junhui Deng, Professor, Department of Computer Science, Tsinghua University"
|
||||
],
|
||||
[
|
||||
"“If I had had Hello Algo when I was learning data structures and algorithms, it would have been ten times easier!”",
|
||||
"— Mu Li, Senior Principal Scientist, Amazon"
|
||||
]
|
||||
],
|
||||
"features": [
|
||||
{
|
||||
"title": "Animated illustrations",
|
||||
"description": "Clear explanations and a gradual learning curve",
|
||||
"quotes": [
|
||||
"\"A picture is worth a thousand words.\""
|
||||
],
|
||||
"video": "en_animation",
|
||||
"video_label": "Animation example"
|
||||
},
|
||||
{
|
||||
"title": "Run code with one click",
|
||||
"description": "Code in more than ten programming languages, with execution visualizations",
|
||||
"quotes": [
|
||||
"\"Talk is cheap. Show me the code.\""
|
||||
],
|
||||
"video": "en_running_code",
|
||||
"video_label": "Running code example"
|
||||
},
|
||||
{
|
||||
"title": "Learn together",
|
||||
"description": "Ask questions, join discussions, and learn with fellow readers",
|
||||
"quotes": [
|
||||
"\"Learning by teaching.\""
|
||||
],
|
||||
"video": "en_comment",
|
||||
"video_label": "Comments example"
|
||||
}
|
||||
],
|
||||
"people": [
|
||||
{
|
||||
"title": "Author",
|
||||
"description": null,
|
||||
"profiles": [
|
||||
{
|
||||
"href": "https://github.com/krahets",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_yudongjin",
|
||||
"alt": "Author: yudongjin",
|
||||
"name": "Yudong Jin (@krahets)",
|
||||
"detail": null
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "Code reviewers",
|
||||
"description": "The developers below worked together on the code in different programming languages. Thank you for your efforts and contributions!",
|
||||
"profiles": [
|
||||
{
|
||||
"href": "https://github.com/coderonion",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_coderonion",
|
||||
"alt": "Reviewer: coderonion",
|
||||
"name": "coderonion",
|
||||
"detail": "Zig, Rust"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/curtishd",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_curtishd",
|
||||
"alt": "Reviewer: curtishd",
|
||||
"name": "curtishd",
|
||||
"detail": "Kotlin"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/Gonglja",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_Gonglja",
|
||||
"alt": "Reviewer: Gonglja",
|
||||
"name": "Gonglja",
|
||||
"detail": "C, C++"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/gvenusleo",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_gvenusleo",
|
||||
"alt": "Reviewer: gvenusleo",
|
||||
"name": "gvenusleo",
|
||||
"detail": "Dart"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/hpstory",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_hpstory",
|
||||
"alt": "Reviewer: hpstory",
|
||||
"name": "hpstory",
|
||||
"detail": "C#"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/justin-tse",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_justin-tse",
|
||||
"alt": "Reviewer: justin-tse",
|
||||
"name": "justin-tse",
|
||||
"detail": "JS, TS"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/khoaxuantu",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_khoaxuantu",
|
||||
"alt": "Reviewer: khoaxuantu",
|
||||
"name": "khoaxuantu",
|
||||
"detail": "Ruby"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/krahets",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_krahets",
|
||||
"alt": "Reviewer: krahets",
|
||||
"name": "krahets",
|
||||
"detail": "Python, Java"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/night-cruise",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_night-cruise",
|
||||
"alt": "Reviewer: night-cruise",
|
||||
"name": "night-cruise",
|
||||
"detail": "Rust"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/nuomi1",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_nuomi1",
|
||||
"alt": "Reviewer: nuomi1",
|
||||
"name": "nuomi1",
|
||||
"detail": "Swift"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/Reanon",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_Reanon",
|
||||
"alt": "Reviewer: Reanon",
|
||||
"name": "Reanon",
|
||||
"detail": "Go, C"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/rongyi",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_rongyi",
|
||||
"alt": "Reviewer: rongyi",
|
||||
"name": "rongyi",
|
||||
"detail": "Rust"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "Contributors",
|
||||
"description": "More than 200 open-source contributors have helped improve this book. Thank you for your time and effort!",
|
||||
"profiles": [],
|
||||
"banner": {
|
||||
"href": "https://github.com/krahets/hello-algo/graphs/contributors",
|
||||
"url": "https://contrib.rocks/image?repo=krahets/hello-algo&max=300&columns=12",
|
||||
"alt": "Contributors",
|
||||
"style": "width: 100%; max-width: 38.5em;"
|
||||
}
|
||||
}
|
||||
],
|
||||
"reading_notes": []
|
||||
}
|
||||
244
overrides/homepage/locales/ja.json
Normal file
244
overrides/homepage/locales/ja.json
Normal file
@@ -0,0 +1,244 @@
|
||||
{
|
||||
"hero_class": "hero-div hero-div--ja",
|
||||
"list_layout": true,
|
||||
"labels": {
|
||||
"astronaut": "アルゴリズム入門",
|
||||
"chapter_computational_complexity": "計算量",
|
||||
"chapter_array_and_linkedlist": "配列と連結リスト",
|
||||
"chapter_stack_and_queue": "スタックとキュー",
|
||||
"chapter_hashing": "ハッシュテーブル",
|
||||
"chapter_tree": "木",
|
||||
"chapter_heap": "ヒープ",
|
||||
"chapter_graph": "グラフ",
|
||||
"chapter_searching": "探索",
|
||||
"chapter_sorting": "ソート",
|
||||
"chapter_divide_and_conquer": "分割統治",
|
||||
"chapter_backtracking": "バックトラッキング",
|
||||
"chapter_dynamic_programming": "動的計画法",
|
||||
"chapter_greedy": "貪欲法"
|
||||
},
|
||||
"label_styles": {
|
||||
"astronaut": "left: 52.244%; top: 20.919%;",
|
||||
"chapter_computational_complexity": "left: 39.244%; top: 33.919%;",
|
||||
"chapter_array_and_linkedlist": "left: 90.897%; top: 76.259%;",
|
||||
"chapter_stack_and_queue": "left: 77.571%; top: 91.25%;",
|
||||
"chapter_hashing": "left: 68.862%; top: 46.292%;",
|
||||
"chapter_tree": "left: 96.159%; top: 44.8%;",
|
||||
"chapter_heap": "left: 88.103%; top: 15.422%;",
|
||||
"chapter_graph": "left: 71.195%; top: 6.503%;",
|
||||
"chapter_searching": "left: 14.556%; top: 20.876%;",
|
||||
"chapter_sorting": "left: 28.805%; top: 53.808%;",
|
||||
"chapter_divide_and_conquer": "left: 31.42%; top: 8.679%;",
|
||||
"chapter_backtracking": "left: 4.742%; top: 50.113%;",
|
||||
"chapter_dynamic_programming": "left: 8.561%; top: 75.351%;",
|
||||
"chapter_greedy": "left: 21.619%; top: 86.85%;"
|
||||
},
|
||||
"typing": {
|
||||
"style": "height: min(9vh, 12vw);",
|
||||
"src": "https://readme-typing-svg.demolab.com/?font=Noto+Sans+JP&weight=400&duration=3500&pause=2000&color=FFF¢er=true&vCenter=true&random=false&width=200&lines=Hello%2C+Algo+!",
|
||||
"alt": ""
|
||||
},
|
||||
"tagline": "アニメーションによる図解とワンクリックで実行できるコードで学ぶ、データ構造とアルゴリズムの入門書",
|
||||
"start_label": "読み始める",
|
||||
"start_href": "chapter_hello_algo/",
|
||||
"reading": [
|
||||
{
|
||||
"asset": "web_mac_iphone",
|
||||
"href": "chapter_hello_algo/",
|
||||
"alt": "",
|
||||
"label": "オンラインで読む",
|
||||
"image_style": "height: 66.31%;",
|
||||
"spacers": [
|
||||
"height: 4.34%;",
|
||||
"height: 4.34%;"
|
||||
]
|
||||
},
|
||||
{
|
||||
"asset": "pdf_ipad",
|
||||
"href": "https://github.com/krahets/hello-algo/releases",
|
||||
"alt": "",
|
||||
"label": "既存の PDF/EPUB を確認",
|
||||
"image_style": "height: 75%;",
|
||||
"spacers": []
|
||||
}
|
||||
],
|
||||
"reading_description": "500 点のアニメーション図解、14 種類のプログラミング言語のコード、コミュニティでの 3000 件の質問と回答が、データ構造とアルゴリズムの入門を支えます。",
|
||||
"endorsement_title": "推薦の言葉",
|
||||
"endorsements": [
|
||||
[
|
||||
"「手を動かし、考えながら学べる、わかりやすいデータ構造とアルゴリズムの入門書です。アルゴリズムを初めて学ぶ方に、ぜひおすすめします。」",
|
||||
"—— 邓俊辉、清華大学コンピュータ科学系教授"
|
||||
],
|
||||
[
|
||||
"「私がデータ構造とアルゴリズムを学んでいた頃に『Hello Algo』があれば、学ぶのが 10 倍楽になっていたでしょう！」",
|
||||
"—— 李沐、Amazon シニア・プリンシパル・サイエンティスト"
|
||||
]
|
||||
],
|
||||
"features": [
|
||||
{
|
||||
"title": "アニメーションによる図解",
|
||||
"description": "わかりやすい内容で、無理なく学べます",
|
||||
"quotes": [
|
||||
"\"A picture is worth a thousand words.\"",
|
||||
"「一枚の図は千の言葉に勝る」"
|
||||
],
|
||||
"video": "animation",
|
||||
"video_label": "アルゴリズムの動きを示すアニメーション"
|
||||
},
|
||||
{
|
||||
"title": "ワンクリックで実行",
|
||||
"description": "十数種類のプログラミング言語に対応し、コードの実行を可視化できます",
|
||||
"quotes": [
|
||||
"\"Talk is cheap. Show me the code.\"",
|
||||
"「口で語るより、コードを見せよう」"
|
||||
],
|
||||
"video": "running_code",
|
||||
"video_label": "コードを実行する例"
|
||||
},
|
||||
{
|
||||
"title": "読者同士で学び合う",
|
||||
"description": "質問や意見を交わし、読者同士で一緒に理解を深めましょう",
|
||||
"quotes": [
|
||||
"\"Learning by teaching.\"",
|
||||
"「教えることも、学びにつながる」"
|
||||
],
|
||||
"video": "comment",
|
||||
"video_label": "コメントで学び合う例"
|
||||
}
|
||||
],
|
||||
"people": [
|
||||
{
|
||||
"title": "著者",
|
||||
"description": null,
|
||||
"profiles": [
|
||||
{
|
||||
"href": "https://github.com/krahets",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_yudongjin",
|
||||
"alt": "著者：yudongjin",
|
||||
"name": "靳宇栋（@krahets）",
|
||||
"detail": null
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "コードのレビュー担当者",
|
||||
"description": "原書のさまざまな言語によるコードは、次の開発者の協力によって作られました。その尽力と貢献に感謝します！",
|
||||
"profiles": [
|
||||
{
|
||||
"href": "https://github.com/coderonion",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_coderonion",
|
||||
"alt": "コードのレビュー担当者：coderonion",
|
||||
"name": "coderonion",
|
||||
"detail": "Zig, Rust"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/curtishd",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_curtishd",
|
||||
"alt": "コードのレビュー担当者：curtishd",
|
||||
"name": "curtishd",
|
||||
"detail": "Kotlin"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/Gonglja",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_Gonglja",
|
||||
"alt": "コードのレビュー担当者：Gonglja",
|
||||
"name": "Gonglja",
|
||||
"detail": "C, C++"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/gvenusleo",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_gvenusleo",
|
||||
"alt": "コードのレビュー担当者：gvenusleo",
|
||||
"name": "gvenusleo",
|
||||
"detail": "Dart"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/hpstory",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_hpstory",
|
||||
"alt": "コードのレビュー担当者：hpstory",
|
||||
"name": "hpstory",
|
||||
"detail": "C#"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/justin-tse",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_justin-tse",
|
||||
"alt": "コードのレビュー担当者：justin-tse",
|
||||
"name": "justin-tse",
|
||||
"detail": "JS, TS"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/khoaxuantu",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_khoaxuantu",
|
||||
"alt": "コードのレビュー担当者：khoaxuantu",
|
||||
"name": "khoaxuantu",
|
||||
"detail": "Ruby"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/krahets",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_krahets",
|
||||
"alt": "コードのレビュー担当者：krahets",
|
||||
"name": "krahets",
|
||||
"detail": "Python, Java"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/night-cruise",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_night-cruise",
|
||||
"alt": "コードのレビュー担当者：night-cruise",
|
||||
"name": "night-cruise",
|
||||
"detail": "Rust"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/nuomi1",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_nuomi1",
|
||||
"alt": "コードのレビュー担当者：nuomi1",
|
||||
"name": "nuomi1",
|
||||
"detail": "Swift"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/Reanon",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_Reanon",
|
||||
"alt": "コードのレビュー担当者：Reanon",
|
||||
"name": "Reanon",
|
||||
"detail": "Go, C"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/rongyi",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_rongyi",
|
||||
"alt": "コードのレビュー担当者：rongyi",
|
||||
"name": "rongyi",
|
||||
"detail": "Rust"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "貢献者",
|
||||
"description": "本書は、オープンソースコミュニティの 200 人以上の貢献者の協力により、改善を重ねています。時間と労力を注いでくださった皆さんに感謝します！",
|
||||
"profiles": [],
|
||||
"banner": {
|
||||
"href": "https://github.com/krahets/hello-algo/graphs/contributors",
|
||||
"url": "https://contrib.rocks/image?repo=krahets/hello-algo&max=300&columns=12",
|
||||
"alt": "貢献者の皆さん",
|
||||
"style": "width: 100%; max-width: 38.5em;"
|
||||
}
|
||||
}
|
||||
],
|
||||
"reading_notes": [
|
||||
{
|
||||
"text": "日本語版はオンラインで公開しています。ダウンロード先には既存の各言語版が掲載されており、今回の公開に伴う新たな日本語 PDF/EPUB の配布はありません。",
|
||||
"style": ""
|
||||
}
|
||||
]
|
||||
}
|
||||
239
overrides/homepage/locales/ko.json
Normal file
239
overrides/homepage/locales/ko.json
Normal file
@@ -0,0 +1,239 @@
|
||||
{
|
||||
"hero_class": "hero-div hero-div--ko",
|
||||
"list_layout": false,
|
||||
"labels": {
|
||||
"astronaut": "알고리즘과의 첫 만남",
|
||||
"chapter_computational_complexity": "복잡도",
|
||||
"chapter_array_and_linkedlist": "배열과 연결 리스트",
|
||||
"chapter_stack_and_queue": "스택과 큐",
|
||||
"chapter_hashing": "해시 테이블",
|
||||
"chapter_tree": "트리",
|
||||
"chapter_heap": "힙",
|
||||
"chapter_graph": "그래프",
|
||||
"chapter_searching": "탐색",
|
||||
"chapter_sorting": "정렬",
|
||||
"chapter_divide_and_conquer": "분할 정복",
|
||||
"chapter_backtracking": "백트래킹",
|
||||
"chapter_dynamic_programming": "동적 계획법",
|
||||
"chapter_greedy": "탐욕"
|
||||
},
|
||||
"label_styles": {
|
||||
"astronaut": "left: 52.244%; top: 20.919%;",
|
||||
"chapter_computational_complexity": "left: 39.244%; top: 33.919%;",
|
||||
"chapter_array_and_linkedlist": "left: 90.897%; top: 76.259%;",
|
||||
"chapter_stack_and_queue": "left: 77.571%; top: 91.25%;",
|
||||
"chapter_hashing": "left: 68.862%; top: 46.292%;",
|
||||
"chapter_tree": "left: 96.159%; top: 44.8%;",
|
||||
"chapter_heap": "left: 88.103%; top: 15.422%;",
|
||||
"chapter_graph": "left: 71.195%; top: 6.503%;",
|
||||
"chapter_searching": "left: 14.556%; top: 20.876%;",
|
||||
"chapter_sorting": "left: 28.805%; top: 53.808%;",
|
||||
"chapter_divide_and_conquer": "left: 31.42%; top: 8.679%;",
|
||||
"chapter_backtracking": "left: 4.742%; top: 50.113%;",
|
||||
"chapter_dynamic_programming": "left: 8.561%; top: 75.351%;",
|
||||
"chapter_greedy": "left: 21.619%; top: 86.85%;"
|
||||
},
|
||||
"typing": {
|
||||
"style": "height: min(9vh, 12vw);",
|
||||
"src": "https://readme-typing-svg.demolab.com/?font=Noto+Sans+KR&weight=400&duration=3500&pause=2000&color=FFF¢er=true&vCenter=true&random=false&width=200&lines=Hello%2C%20%EC%95%8C%EA%B3%A0%EB%A6%AC%EC%A6%98%21",
|
||||
"alt": ""
|
||||
},
|
||||
"tagline": "애니메이션으로 설명하고 클릭 한 번으로 실행하는 자료 구조와 알고리즘 입문서",
|
||||
"start_label": "읽기 시작하기",
|
||||
"start_href": "chapter_hello_algo/",
|
||||
"reading": [
|
||||
{
|
||||
"asset": "web_mac_iphone",
|
||||
"href": "chapter_hello_algo/",
|
||||
"alt": "",
|
||||
"label": "온라인으로 읽기",
|
||||
"image_style": "height: 66.31%;",
|
||||
"spacers": [
|
||||
"height: 4.34%;",
|
||||
"height: 4.34%;"
|
||||
]
|
||||
},
|
||||
{
|
||||
"asset": "pdf_ipad",
|
||||
"href": "https://github.com/krahets/hello-algo/releases",
|
||||
"alt": "",
|
||||
"label": "PDF/EPUB 제공 언어 확인",
|
||||
"image_style": "height: 75%;",
|
||||
"spacers": []
|
||||
}
|
||||
],
|
||||
"reading_description": "500개의 애니메이션 그림, 14개 프로그래밍 언어의 코드, 3000개의 커뮤니티 질문과 답변으로 자료 구조와 알고리즘의 기초를 빠르게 익힐 수 있다",
|
||||
"endorsement_title": "추천의 말",
|
||||
"endorsements": [
|
||||
[
|
||||
"“쉽게 읽을 수 있는 자료 구조와 알고리즘 입문서다. 직접 실습하고 생각하며 배우도록 안내한다. 알고리즘 입문자에게 적극 추천한다.”",
|
||||
"—— 덩쥔후이, 칭화대학교 컴퓨터학과 교수"
|
||||
],
|
||||
[
|
||||
"“내가 자료 구조와 알고리즘을 배울 때 『Hello 알고리즘』이 있었다면 공부가 열 배는 쉬웠을 것이다!”",
|
||||
"—— 리무, 아마존 수석 과학자(Senior Principal Scientist)"
|
||||
]
|
||||
],
|
||||
"features": [
|
||||
{
|
||||
"title": "애니메이션 그림",
|
||||
"description": "명확하고 이해하기 쉬운 내용, 완만한 학습 곡선",
|
||||
"quotes": [
|
||||
"\"A picture is worth a thousand words.\"",
|
||||
"“그림 한 장이 천 마디 말보다 낫다”"
|
||||
],
|
||||
"video": "animation",
|
||||
"video_label": "애니메이션 예제"
|
||||
},
|
||||
{
|
||||
"title": "클릭 한 번으로 실행",
|
||||
"description": "열 가지가 넘는 프로그래밍 언어와 코드 실행 시각화",
|
||||
"quotes": [
|
||||
"\"Talk is cheap. Show me the code.\"",
|
||||
"“말보다 코드를 보여 달라”"
|
||||
],
|
||||
"video": "running_code",
|
||||
"video_label": "코드 실행 예제"
|
||||
},
|
||||
{
|
||||
"title": "함께 배우기",
|
||||
"description": "질문과 토론을 나누며 함께 성장하는 독자들",
|
||||
"quotes": [
|
||||
"\"Learning by teaching.\"",
|
||||
"“가르치며 배운다”"
|
||||
],
|
||||
"video": "comment",
|
||||
"video_label": "댓글 예제"
|
||||
}
|
||||
],
|
||||
"people": [
|
||||
{
|
||||
"title": "저자",
|
||||
"description": null,
|
||||
"profiles": [
|
||||
{
|
||||
"href": "https://github.com/krahets",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_yudongjin",
|
||||
"alt": "저자: yudongjin",
|
||||
"name": "진위둥(@krahets)",
|
||||
"detail": null
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "코드 검토자",
|
||||
"description": "다음 개발자들이 함께 힘을 모아 여러 언어의 예제 코드를 완성했다. 이들의 노력과 기여에 감사드린다!",
|
||||
"profiles": [
|
||||
{
|
||||
"href": "https://github.com/coderonion",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_coderonion",
|
||||
"alt": "검토자: coderonion",
|
||||
"name": "coderonion",
|
||||
"detail": "Zig, Rust"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/curtishd",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_curtishd",
|
||||
"alt": "검토자: curtishd",
|
||||
"name": "curtishd",
|
||||
"detail": "Kotlin"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/Gonglja",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_Gonglja",
|
||||
"alt": "검토자: Gonglja",
|
||||
"name": "Gonglja",
|
||||
"detail": "C, C++"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/gvenusleo",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_gvenusleo",
|
||||
"alt": "검토자: gvenusleo",
|
||||
"name": "gvenusleo",
|
||||
"detail": "Dart"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/hpstory",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_hpstory",
|
||||
"alt": "검토자: hpstory",
|
||||
"name": "hpstory",
|
||||
"detail": "C#"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/justin-tse",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_justin-tse",
|
||||
"alt": "검토자: justin-tse",
|
||||
"name": "justin-tse",
|
||||
"detail": "JS, TS"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/khoaxuantu",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_khoaxuantu",
|
||||
"alt": "검토자: khoaxuantu",
|
||||
"name": "khoaxuantu",
|
||||
"detail": "Ruby"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/krahets",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_krahets",
|
||||
"alt": "검토자: krahets",
|
||||
"name": "krahets",
|
||||
"detail": "Python, Java"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/night-cruise",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_night-cruise",
|
||||
"alt": "검토자: night-cruise",
|
||||
"name": "night-cruise",
|
||||
"detail": "Rust"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/nuomi1",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_nuomi1",
|
||||
"alt": "검토자: nuomi1",
|
||||
"name": "nuomi1",
|
||||
"detail": "Swift"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/Reanon",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_Reanon",
|
||||
"alt": "검토자: Reanon",
|
||||
"name": "Reanon",
|
||||
"detail": "Go, C"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/rongyi",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_rongyi",
|
||||
"alt": "검토자: rongyi",
|
||||
"name": "rongyi",
|
||||
"detail": "Rust"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "기여자",
|
||||
"description": "이 책은 오픈 소스 커뮤니티의 200명이 넘는 기여자가 함께 노력한 덕분에 꾸준히 발전하고 있다. 시간과 노력을 들여 준 모든 분께 감사드린다!",
|
||||
"profiles": [],
|
||||
"banner": {
|
||||
"href": "https://github.com/krahets/hello-algo/graphs/contributors",
|
||||
"url": "https://contrib.rocks/image?repo=krahets/hello-algo&max=300&columns=12",
|
||||
"alt": "기여자",
|
||||
"style": "width: 100%; max-width: 38.5em;"
|
||||
}
|
||||
}
|
||||
],
|
||||
"reading_notes": []
|
||||
}
|
||||
261
overrides/homepage/locales/ru.json
Normal file
261
overrides/homepage/locales/ru.json
Normal file
@@ -0,0 +1,261 @@
|
||||
{
|
||||
"hero_class": "hero-div hero-div--ru",
|
||||
"list_layout": true,
|
||||
"labels": {
|
||||
"astronaut": "Первое знакомство с алгоритмами",
|
||||
"chapter_computational_complexity": "Сложность",
|
||||
"chapter_array_and_linkedlist": "Массивы и списки",
|
||||
"chapter_stack_and_queue": "Стеки и очереди",
|
||||
"chapter_hashing": "Хеш-таблицы",
|
||||
"chapter_tree": "Деревья",
|
||||
"chapter_heap": "Кучи",
|
||||
"chapter_graph": "Графы",
|
||||
"chapter_searching": "Поиск",
|
||||
"chapter_sorting": "Сортировка",
|
||||
"chapter_divide_and_conquer": "Разделяй и властвуй",
|
||||
"chapter_backtracking": "Поиск с возвратом",
|
||||
"chapter_dynamic_programming": "Динамическое программирование",
|
||||
"chapter_greedy": "Жадные алгоритмы"
|
||||
},
|
||||
"label_styles": {
|
||||
"astronaut": "left: 49.244%; top: 22.2%;",
|
||||
"chapter_computational_complexity": "left: 34.244%; top: 33.919%;",
|
||||
"chapter_array_and_linkedlist": "left: 83.897%; top: 76.259%;",
|
||||
"chapter_stack_and_queue": "left: 77.571%; top: 91.25%;",
|
||||
"chapter_hashing": "left: 68.862%; top: 46.292%;",
|
||||
"chapter_tree": "left: 96.159%; top: 44.8%;",
|
||||
"chapter_heap": "left: 88.103%; top: 15.422%;",
|
||||
"chapter_graph": "left: 71.195%; top: 6.503%;",
|
||||
"chapter_searching": "left: 14.556%; top: 20.876%;",
|
||||
"chapter_sorting": "left: 28.805%; top: 53.808%;",
|
||||
"chapter_divide_and_conquer": "left: 28.42%; top: 8.679%;",
|
||||
"chapter_backtracking": "left: 4.742%; top: 50.113%;",
|
||||
"chapter_dynamic_programming": "left: 6.561%; top: 75.351%;",
|
||||
"chapter_greedy": "left: 20.619%; top: 86.85%;"
|
||||
},
|
||||
"typing": {
|
||||
"style": "height: min(9vh, 12vw);",
|
||||
"src": "https://readme-typing-svg.demolab.com/?font=Roboto&weight=400&duration=3500&pause=2000&color=FFF¢er=true&vCenter=true&random=false&width=260&lines=Hello%2C+%D0%90%D0%BB%D0%B3%D0%BE!",
|
||||
"alt": ""
|
||||
},
|
||||
"tagline": "Учебник по структурам данных и алгоритмам с анимированными схемами и кодом, готовым к запуску в один клик",
|
||||
"start_label": "Начать чтение",
|
||||
"start_href": "chapter_hello_algo/",
|
||||
"reading": [
|
||||
{
|
||||
"asset": "web_mac_iphone",
|
||||
"href": "chapter_hello_algo/",
|
||||
"alt": "",
|
||||
"label": "Читать онлайн",
|
||||
"image_style": "height: 66.31%;",
|
||||
"spacers": [
|
||||
"height: 4.34%;",
|
||||
"height: 4.34%;"
|
||||
]
|
||||
},
|
||||
{
|
||||
"asset": "pdf_ipad",
|
||||
"href": "https://github.com/krahets/hello-algo/releases",
|
||||
"alt": "",
|
||||
"label": "Скачать PDF/EPUB",
|
||||
"image_style": "height: 75%;",
|
||||
"spacers": []
|
||||
}
|
||||
],
|
||||
"reading_description": "500 анимированных схем, код на 14 языках программирования и 3000 ответов сообщества помогут вам быстро войти в мир структур данных и алгоритмов.",
|
||||
"endorsement_title": "Рекомендации",
|
||||
"endorsements": [
|
||||
[
|
||||
"«Понятная вводная книга по структурам данных и алгоритмам, которая ведет читателя через практическое обучение шаг за шагом. Очень рекомендую всем начинающим.»",
|
||||
"—— Junhui Deng, профессор факультета компьютерных наук Университета Цинхуа"
|
||||
],
|
||||
[
|
||||
"«Если бы у меня была “Hello Algo”, когда я изучал структуры данных и алгоритмы, учиться было бы в десять раз проще!»",
|
||||
"—— Mu Li, Senior Principal Scientist, Amazon"
|
||||
]
|
||||
],
|
||||
"features": [
|
||||
{
|
||||
"title": "Анимированные схемы",
|
||||
"description": "Материал изложен ясно и последовательно, поэтому вход в тему получается плавным.",
|
||||
"quotes": [
|
||||
"\"A picture is worth a thousand words.\"",
|
||||
"«Одна схема стоит тысячи слов»"
|
||||
],
|
||||
"video": "animation",
|
||||
"video_label": "Animation example"
|
||||
},
|
||||
{
|
||||
"title": "Запуск в один клик",
|
||||
"description": "Код на более чем десяти языках можно запускать и визуализировать прямо в книге.",
|
||||
"quotes": [
|
||||
"\"Talk is cheap. Show me the code.\"",
|
||||
"«Меньше слов, больше кода»"
|
||||
],
|
||||
"video": "running_code",
|
||||
"video_label": "Running code example"
|
||||
},
|
||||
{
|
||||
"title": "Учимся вместе",
|
||||
"description": "Добро пожаловать к обсуждениям и вопросам: продвигаться вместе проще.",
|
||||
"quotes": [
|
||||
"\"Learning by teaching.\"",
|
||||
"«Обучая других, учишься сам»"
|
||||
],
|
||||
"video": "comment",
|
||||
"video_label": "Comments example"
|
||||
}
|
||||
],
|
||||
"people": [
|
||||
{
|
||||
"title": "Автор",
|
||||
"description": null,
|
||||
"profiles": [
|
||||
{
|
||||
"href": "https://github.com/krahets",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_yudongjin",
|
||||
"alt": "Author: yudongjin",
|
||||
"name": "Yudong Jin (@krahets)",
|
||||
"detail": null
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "Переводчики",
|
||||
"description": "Русская печатная версия была переведена И. А. Шевкун, а русская онлайн-версия была вычитана Yuyan Huang. Благодарим их за вклад!",
|
||||
"profiles": [
|
||||
{
|
||||
"href": null,
|
||||
"class": "profile-cell translator-profile-cell",
|
||||
"asset": "avatar_shevkun",
|
||||
"alt": "Translator: shevkun",
|
||||
"name": "И. А. Шевкун",
|
||||
"detail": null
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/veronicahuang2977",
|
||||
"class": "profile-cell translator-profile-cell",
|
||||
"asset": "avatar_yuyanhuang",
|
||||
"alt": "Translator: yuyanhuang",
|
||||
"name": "Yuyan Huang",
|
||||
"detail": null
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "Ревьюеры кода",
|
||||
"description": "Многоязычные версии кода в этой книге были подготовлены при участии следующих разработчиков. Благодарим их за время и вклад!",
|
||||
"profiles": [
|
||||
{
|
||||
"href": "https://github.com/coderonion",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_coderonion",
|
||||
"alt": "Reviewer: coderonion",
|
||||
"name": "coderonion",
|
||||
"detail": "Zig, Rust"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/curtishd",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_curtishd",
|
||||
"alt": "Reviewer: curtishd",
|
||||
"name": "curtishd",
|
||||
"detail": "Kotlin"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/Gonglja",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_Gonglja",
|
||||
"alt": "Reviewer: Gonglja",
|
||||
"name": "Gonglja",
|
||||
"detail": "C, C++"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/gvenusleo",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_gvenusleo",
|
||||
"alt": "Reviewer: gvenusleo",
|
||||
"name": "gvenusleo",
|
||||
"detail": "Dart"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/hpstory",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_hpstory",
|
||||
"alt": "Reviewer: hpstory",
|
||||
"name": "hpstory",
|
||||
"detail": "C#"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/justin-tse",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_justin-tse",
|
||||
"alt": "Reviewer: justin-tse",
|
||||
"name": "justin-tse",
|
||||
"detail": "JS, TS"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/khoaxuantu",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_khoaxuantu",
|
||||
"alt": "Reviewer: khoaxuantu",
|
||||
"name": "khoaxuantu",
|
||||
"detail": "Ruby"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/krahets",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_krahets",
|
||||
"alt": "Reviewer: krahets",
|
||||
"name": "krahets",
|
||||
"detail": "Python, Java"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/night-cruise",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_night-cruise",
|
||||
"alt": "Reviewer: night-cruise",
|
||||
"name": "night-cruise",
|
||||
"detail": "Rust"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/nuomi1",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_nuomi1",
|
||||
"alt": "Reviewer: nuomi1",
|
||||
"name": "nuomi1",
|
||||
"detail": "Swift"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/Reanon",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_Reanon",
|
||||
"alt": "Reviewer: Reanon",
|
||||
"name": "Reanon",
|
||||
"detail": "Go, C"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/rongyi",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_rongyi",
|
||||
"alt": "Reviewer: rongyi",
|
||||
"name": "rongyi",
|
||||
"detail": "Rust"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "Участники проекта",
|
||||
"description": "Книга постоянно совершенствуется благодаря совместным усилиям более чем 200 участников сообщества. Спасибо им за время и вклад!",
|
||||
"profiles": [],
|
||||
"banner": {
|
||||
"href": "https://github.com/krahets/hello-algo/graphs/contributors",
|
||||
"url": "https://contrib.rocks/image?repo=krahets/hello-algo&max=300&columns=12",
|
||||
"alt": "Contributors",
|
||||
"style": "width: 100%; max-width: 38.5em;"
|
||||
}
|
||||
}
|
||||
],
|
||||
"reading_notes": []
|
||||
}
|
||||
159
overrides/homepage/locales/zh-hant.json
Normal file
159
overrides/homepage/locales/zh-hant.json
Normal file
@@ -0,0 +1,159 @@
|
||||
{
|
||||
"extends": "zh",
|
||||
"overrides": {
|
||||
"typing/src": "https://readme-typing-svg.demolab.com/?font=Noto+Sans+SC&weight=400&duration=3500&pause=2000&color=FFF¢er=true&vCenter=true&random=false&width=200&lines=Hello%2C+%E6%BC%94%E7%AE%97%E6%B3%95+!",
|
||||
"reading/0/href": "/chapter_paperbook/",
|
||||
"reading/0/label": "了解紙質書",
|
||||
"people": [
|
||||
{
|
||||
"title": "作者",
|
||||
"description": null,
|
||||
"profiles": [
|
||||
{
|
||||
"href": "https://github.com/krahets",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_yudongjin",
|
||||
"alt": "Author: yudongjin",
|
||||
"name": "靳宇棟（@krahets）",
|
||||
"detail": null
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "譯者",
|
||||
"description": "本書繁體中文版由以下譯者審閱，感謝他們的貢獻！",
|
||||
"profiles": [
|
||||
{
|
||||
"href": "https://github.com/Shyam-Chen",
|
||||
"class": "profile-cell translator-profile-cell",
|
||||
"asset": "avatar_Shyam-Chen",
|
||||
"alt": "Reviewer: Shyam-Chen",
|
||||
"name": "Shyam-Chen",
|
||||
"detail": null
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/Dr-XYZ",
|
||||
"class": "profile-cell translator-profile-cell",
|
||||
"asset": "avatar_Dr-XYZ",
|
||||
"alt": "Reviewer: Dr-XYZ",
|
||||
"name": "Dr-XYZ",
|
||||
"detail": null
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "程式碼審閱者",
|
||||
"description": "本書多語言程式碼版本由以下開發者協力完成，感謝他們的投入與貢獻！",
|
||||
"profiles": [
|
||||
{
|
||||
"href": "https://github.com/coderonion",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_coderonion",
|
||||
"alt": "Reviewer: coderonion",
|
||||
"name": "coderonion",
|
||||
"detail": "Zig, Rust"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/curtishd",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_curtishd",
|
||||
"alt": "Reviewer: curtishd",
|
||||
"name": "curtishd",
|
||||
"detail": "Kotlin"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/Gonglja",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_Gonglja",
|
||||
"alt": "Reviewer: Gonglja",
|
||||
"name": "Gonglja",
|
||||
"detail": "C, C++"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/gvenusleo",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_gvenusleo",
|
||||
"alt": "Reviewer: gvenusleo",
|
||||
"name": "gvenusleo",
|
||||
"detail": "Dart"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/hpstory",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_hpstory",
|
||||
"alt": "Reviewer: hpstory",
|
||||
"name": "hpstory",
|
||||
"detail": "C#"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/justin-tse",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_justin-tse",
|
||||
"alt": "Reviewer: justin-tse",
|
||||
"name": "justin-tse",
|
||||
"detail": "JS, TS"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/khoaxuantu",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_khoaxuantu",
|
||||
"alt": "Reviewer: khoaxuantu",
|
||||
"name": "khoaxuantu",
|
||||
"detail": "Ruby"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/krahets",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_krahets",
|
||||
"alt": "Reviewer: krahets",
|
||||
"name": "krahets",
|
||||
"detail": "Python, Java"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/night-cruise",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_night-cruise",
|
||||
"alt": "Reviewer: night-cruise",
|
||||
"name": "night-cruise",
|
||||
"detail": "Rust"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/nuomi1",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_nuomi1",
|
||||
"alt": "Reviewer: nuomi1",
|
||||
"name": "nuomi1",
|
||||
"detail": "Swift"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/Reanon",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_Reanon",
|
||||
"alt": "Reviewer: Reanon",
|
||||
"name": "Reanon",
|
||||
"detail": "Go, C"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/rongyi",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_rongyi",
|
||||
"alt": "Reviewer: rongyi",
|
||||
"name": "rongyi",
|
||||
"detail": "Rust"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "貢獻者",
|
||||
"description": "本書在開源社群 200 多位貢獻者的共同努力下不斷完善，感謝他們付出的時間與精力！",
|
||||
"profiles": [],
|
||||
"banner": {
|
||||
"href": "https://github.com/krahets/hello-algo/graphs/contributors",
|
||||
"url": "https://contrib.rocks/image?repo=krahets/hello-algo&max=300&columns=12",
|
||||
"alt": "Contributors",
|
||||
"style": "width: 100%; max-width: 38.5em;"
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
249
overrides/homepage/locales/zh.json
Normal file
249
overrides/homepage/locales/zh.json
Normal file
@@ -0,0 +1,249 @@
|
||||
{
|
||||
"hero_class": "hero-div",
|
||||
"list_layout": false,
|
||||
"labels": {
|
||||
"astronaut": "初识算法",
|
||||
"chapter_computational_complexity": "复杂度",
|
||||
"chapter_array_and_linkedlist": "数组与链表",
|
||||
"chapter_stack_and_queue": "栈与队列",
|
||||
"chapter_hashing": "哈希表",
|
||||
"chapter_tree": "树",
|
||||
"chapter_heap": "堆",
|
||||
"chapter_graph": "图",
|
||||
"chapter_searching": "搜索",
|
||||
"chapter_sorting": "排序",
|
||||
"chapter_divide_and_conquer": "分治",
|
||||
"chapter_backtracking": "回溯",
|
||||
"chapter_dynamic_programming": "动态规划",
|
||||
"chapter_greedy": "贪心"
|
||||
},
|
||||
"label_styles": {
|
||||
"astronaut": "left: 52.244%; top: 20.919%;",
|
||||
"chapter_computational_complexity": "left: 39.244%; top: 33.919%;",
|
||||
"chapter_array_and_linkedlist": "left: 90.897%; top: 76.259%;",
|
||||
"chapter_stack_and_queue": "left: 77.571%; top: 91.25%;",
|
||||
"chapter_hashing": "left: 68.862%; top: 46.292%;",
|
||||
"chapter_tree": "left: 96.159%; top: 44.8%;",
|
||||
"chapter_heap": "left: 88.103%; top: 15.422%;",
|
||||
"chapter_graph": "left: 71.195%; top: 6.503%;",
|
||||
"chapter_searching": "left: 14.556%; top: 20.876%;",
|
||||
"chapter_sorting": "left: 28.805%; top: 53.808%;",
|
||||
"chapter_divide_and_conquer": "left: 31.42%; top: 8.679%;",
|
||||
"chapter_backtracking": "left: 4.742%; top: 50.113%;",
|
||||
"chapter_dynamic_programming": "left: 8.561%; top: 75.351%;",
|
||||
"chapter_greedy": "left: 21.619%; top: 86.85%;"
|
||||
},
|
||||
"typing": {
|
||||
"style": "height: min(9vh, 12vw);",
|
||||
"src": "https://readme-typing-svg.demolab.com/?font=Noto+Sans+SC&weight=400&duration=3500&pause=2000&color=FFF¢er=true&vCenter=true&random=false&width=200&lines=Hello%2C+%E7%AE%97%E6%B3%95+!",
|
||||
"alt": ""
|
||||
},
|
||||
"tagline": "动画图解、一键运行的数据结构与算法教程",
|
||||
"start_label": "开始阅读",
|
||||
"start_href": "chapter_hello_algo/",
|
||||
"reading": [
|
||||
{
|
||||
"asset": "cover_render",
|
||||
"href": "chapter_paperbook/",
|
||||
"alt": "Cover",
|
||||
"label": "了解纸质书",
|
||||
"image_style": "height: 66.83%;",
|
||||
"spacers": [
|
||||
"height: 8.17%;"
|
||||
]
|
||||
},
|
||||
{
|
||||
"asset": "web_mac_iphone",
|
||||
"href": "chapter_hello_algo/",
|
||||
"alt": "",
|
||||
"label": "在线阅读",
|
||||
"image_style": "height: 66.31%;",
|
||||
"spacers": [
|
||||
"height: 4.34%;",
|
||||
"height: 4.34%;"
|
||||
]
|
||||
},
|
||||
{
|
||||
"asset": "pdf_ipad",
|
||||
"href": "https://github.com/krahets/hello-algo/releases",
|
||||
"alt": "",
|
||||
"label": "下载 PDF/EPUB",
|
||||
"image_style": "height: 75%;",
|
||||
"spacers": []
|
||||
}
|
||||
],
|
||||
"reading_description": "500 幅动画图解、14 种编程语言代码、3000 条社区问答，助你快速入门数据结构与算法",
|
||||
"endorsement_title": "推荐语",
|
||||
"endorsements": [
|
||||
[
|
||||
"“一本通俗易懂的数据结构与算法入门书，引导读者手脑并用地学习，强烈推荐算法初学者阅读。”",
|
||||
"—— 邓俊辉，清华大学计算机系教授"
|
||||
],
|
||||
[
|
||||
"“如果我当年学数据结构与算法的时候有《Hello 算法》，学起来应该会简单 10 倍！”",
|
||||
"—— 李沐，亚马逊资深首席科学家"
|
||||
]
|
||||
],
|
||||
"features": [
|
||||
{
|
||||
"title": "动画图解",
|
||||
"description": "内容清晰易懂，学习曲线平滑",
|
||||
"quotes": [
|
||||
"\"A picture is worth a thousand words.\"",
|
||||
"“一图胜千言”"
|
||||
],
|
||||
"video": "animation",
|
||||
"video_label": "Animation example"
|
||||
},
|
||||
{
|
||||
"title": "一键运行",
|
||||
"description": "十余种编程语言，代码可视化运行",
|
||||
"quotes": [
|
||||
"\"Talk is cheap. Show me the code.\"",
|
||||
"“少吹牛，看代码”"
|
||||
],
|
||||
"video": "running_code",
|
||||
"video_label": "Running code example"
|
||||
},
|
||||
{
|
||||
"title": "互助学习",
|
||||
"description": "欢迎讨论与提问，读者间携手共进",
|
||||
"quotes": [
|
||||
"\"Learning by teaching.\"",
|
||||
"“教学相长”"
|
||||
],
|
||||
"video": "comment",
|
||||
"video_label": "Comments example"
|
||||
}
|
||||
],
|
||||
"people": [
|
||||
{
|
||||
"title": "作者",
|
||||
"description": null,
|
||||
"profiles": [
|
||||
{
|
||||
"href": "https://github.com/krahets",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_yudongjin",
|
||||
"alt": "Author: yudongjin",
|
||||
"name": "靳宇栋（@krahets）",
|
||||
"detail": null
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "代码审阅者",
|
||||
"description": "本书多语言代码版本由以下开发者协力完成，感谢他们的投入与贡献！",
|
||||
"profiles": [
|
||||
{
|
||||
"href": "https://github.com/coderonion",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_coderonion",
|
||||
"alt": "Reviewer: coderonion",
|
||||
"name": "coderonion",
|
||||
"detail": "Zig, Rust"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/curtishd",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_curtishd",
|
||||
"alt": "Reviewer: curtishd",
|
||||
"name": "curtishd",
|
||||
"detail": "Kotlin"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/Gonglja",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_Gonglja",
|
||||
"alt": "Reviewer: Gonglja",
|
||||
"name": "Gonglja",
|
||||
"detail": "C, C++"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/gvenusleo",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_gvenusleo",
|
||||
"alt": "Reviewer: gvenusleo",
|
||||
"name": "gvenusleo",
|
||||
"detail": "Dart"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/hpstory",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_hpstory",
|
||||
"alt": "Reviewer: hpstory",
|
||||
"name": "hpstory",
|
||||
"detail": "C#"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/justin-tse",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_justin-tse",
|
||||
"alt": "Reviewer: justin-tse",
|
||||
"name": "justin-tse",
|
||||
"detail": "JS, TS"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/khoaxuantu",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_khoaxuantu",
|
||||
"alt": "Reviewer: khoaxuantu",
|
||||
"name": "khoaxuantu",
|
||||
"detail": "Ruby"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/krahets",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_krahets",
|
||||
"alt": "Reviewer: krahets",
|
||||
"name": "krahets",
|
||||
"detail": "Python, Java"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/night-cruise",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_night-cruise",
|
||||
"alt": "Reviewer: night-cruise",
|
||||
"name": "night-cruise",
|
||||
"detail": "Rust"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/nuomi1",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_nuomi1",
|
||||
"alt": "Reviewer: nuomi1",
|
||||
"name": "nuomi1",
|
||||
"detail": "Swift"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/Reanon",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_Reanon",
|
||||
"alt": "Reviewer: Reanon",
|
||||
"name": "Reanon",
|
||||
"detail": "Go, C"
|
||||
},
|
||||
{
|
||||
"href": "https://github.com/rongyi",
|
||||
"class": "profile-cell",
|
||||
"asset": "avatar_rongyi",
|
||||
"alt": "Reviewer: rongyi",
|
||||
"name": "rongyi",
|
||||
"detail": "Rust"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"title": "贡献者",
|
||||
"description": "本书在开源社区 200 多位贡献者的共同努力下不断完善，感谢他们付出的时间与精力！",
|
||||
"profiles": [],
|
||||
"banner": {
|
||||
"href": "https://github.com/krahets/hello-algo/graphs/contributors",
|
||||
"url": "https://contrib.rocks/image?repo=krahets/hello-algo&max=300&columns=12",
|
||||
"alt": "Contributors",
|
||||
"style": "width: 100%; max-width: 38.5em;"
|
||||
}
|
||||
}
|
||||
],
|
||||
"reading_notes": []
|
||||
}
|
||||
85
overrides/javascripts/hero-hourglass.js
Normal file
85
overrides/javascripts/hero-hourglass.js
Normal file
@@ -0,0 +1,85 @@
|
||||
// A layered vector illustration; no physics engine or independent animation loop.
|
||||
export const HOURGLASS_CYCLE_SECONDS = 28;
|
||||
let instance = 0;
|
||||
export function createHourglass(items) {
|
||||
const item = items.find(item => item.image.dataset.heroAsset === "chapter_computational_complexity");
|
||||
if (!item) return null;
|
||||
const id = `hero-sand-${++instance}`;
|
||||
const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
|
||||
svg.setAttribute("viewBox", "0 0 113 178");
|
||||
svg.setAttribute("aria-hidden", "true");
|
||||
svg.classList.add("hero-hourglass");
|
||||
svg.style.cssText = item.image.style.cssText;
|
||||
svg.innerHTML = `
|
||||
<defs>
|
||||
<clipPath id="${id}-top"><path d="M16 25 Q21 62 56.5 85 Q92 62 97 25Z"/></clipPath>
|
||||
<clipPath id="${id}-bottom"><path d="M56.5 93 Q22 116 16 153 Q56 167 97 153 Q91 116 56.5 93Z"/></clipPath>
|
||||
<linearGradient id="${id}-glass" x1="0" x2="1"><stop stop-color="#193d4b"/><stop offset=".5" stop-color="#204e5d"/><stop offset="1" stop-color="#102b3c"/></linearGradient>
|
||||
<linearGradient id="${id}-sand" x1="0" y1="0" x2="1" y2=".5"><stop stop-color="#fae6a3"/><stop offset=".5" stop-color="#d8c37d"/><stop offset="1" stop-color="#b89b65"/></linearGradient>
|
||||
</defs>
|
||||
<g class="hourglass-body">
|
||||
<path d="M9 19 C12 56 30 77 52 89 C28 105 13 128 9 157 Q56 177 104 157 C100 126 84 103 61 89 C86 73 100 49 104 19Z" fill="url(#${id}-glass)" stroke="#d8d39d" stroke-width="5"/>
|
||||
<path d="M15 26 C24 65 41 77 56 85 C78 69 91 49 97 26 M56 94 C34 113 23 132 16 153 M63 95 C84 118 91 138 97 152" fill="none" stroke="#5c9c9d" stroke-width="3"/>
|
||||
<g class="hourglass-sand">
|
||||
<g clip-path="url(#${id}-top)"><path class="hourglass-upper" fill="url(#${id}-sand)"/><path class="hourglass-surface" fill="none" stroke="#fff0b5" stroke-width="2"/></g>
|
||||
<g clip-path="url(#${id}-bottom)"><path class="hourglass-lower" fill="url(#${id}-sand)"/><path class="hourglass-pile-shade" fill="#ad9363" opacity=".55"/></g>
|
||||
<g class="hourglass-stream" fill="#f6df9b"><path class="hourglass-thread" fill="none" stroke="#efd391" stroke-width="1"/>${Array.from({length:8},(_,i)=>`<circle class="hourglass-grain" r="${i%3===0?0.9:0.55}"/>`).join("")}</g>
|
||||
</g>
|
||||
<path d="M18 31 Q22 48 33 60 M37 65 L44 72 M85 42 Q80 59 68 70 M25 129 L21 144 M32 114 L28 121 M87 130 L91 146" fill="none" stroke="#f6efc3" stroke-width="2.5" stroke-linecap="round"/>
|
||||
<path d="M12 26 Q20 67 50 86 M62 95 Q86 119 100 153" fill="none" stroke="#f8e7ae" stroke-width="1.5"/>
|
||||
<ellipse cx="56.5" cy="18" rx="49" ry="13" fill="#d5cc92" stroke="#f5e7ad" stroke-width="3"/>
|
||||
<ellipse cx="56.5" cy="17" rx="39" ry="8" fill="#244c5a" stroke="#90aaa0" stroke-width="2"/>
|
||||
<path d="M24 18 Q55 9 90 17 M33 21 Q58 17 81 20" fill="none" stroke="#f3ebbb" stroke-width="2" stroke-linecap="round"/>
|
||||
<path d="M8 153 Q56 174 105 153 L104 163 Q57 184 9 163Z" fill="#c8bf89" stroke="#f0e2a5" stroke-width="3"/>
|
||||
<path d="M15 158 Q56 173 99 159" fill="none" stroke="#568d8a" stroke-width="3"/>
|
||||
</g>`;
|
||||
item.image.insertAdjacentElement("afterend", svg);
|
||||
const body = svg.querySelector(".hourglass-body");
|
||||
const sand = svg.querySelector(".hourglass-sand");
|
||||
const upper = svg.querySelector(".hourglass-upper");
|
||||
const surface = svg.querySelector(".hourglass-surface");
|
||||
const lower = svg.querySelector(".hourglass-lower");
|
||||
const shade = svg.querySelector(".hourglass-pile-shade");
|
||||
const stream = svg.querySelector(".hourglass-stream");
|
||||
const thread = svg.querySelector(".hourglass-thread");
|
||||
const grains = [...svg.querySelectorAll(".hourglass-grain")];
|
||||
const smooth = x => x*x*(3-2*x);
|
||||
return {
|
||||
render(time, enabled) {
|
||||
svg.style.display = enabled ? "" : "none";
|
||||
item.image.classList.toggle("hero-replaced", enabled);
|
||||
if (!enabled) return;
|
||||
// Slow the entire choreography, including falling grains and the turn.
|
||||
time *= 14 / HOURGLASS_CYCLE_SECONDS;
|
||||
const phase = time % 14;
|
||||
const turns = Math.floor(time / 14);
|
||||
const progress = Math.min(phase / 11, 1);
|
||||
const flip = smooth(Math.min(1, Math.max(0, (phase-11.6)/1.6)));
|
||||
// Keep turning in the same direction; the frame never snaps back at a loop boundary.
|
||||
body.setAttribute("transform", `rotate(${((turns+flip)*180).toFixed(2)} 56.5 89)`);
|
||||
sand.setAttribute("transform", `rotate(${turns*180} 56.5 89)`);
|
||||
const level = 38 + 47*(1-Math.pow(1-progress, 0.45));
|
||||
const notch = (1-progress)*5;
|
||||
upper.setAttribute("d", `M8 ${level} Q39 ${level-1} 56.5 ${level+notch} Q75 ${level-1} 105 ${level} V89 H8Z`);
|
||||
upper.setAttribute("opacity", progress>0.995?"0":"1");
|
||||
surface.setAttribute("d", `M17 ${level} Q38 ${level-1} 56.5 ${level+notch} Q78 ${level-1} 97 ${level}`);
|
||||
surface.setAttribute("opacity", progress>0.995?"0":".8");
|
||||
const pile = Math.sqrt(progress);
|
||||
// Sand settles toward the neck after inversion, before the next pour begins.
|
||||
const settle = smooth(Math.max(0, Math.min(1, (phase-13.2)/0.8)));
|
||||
const peak = 156-pile*43-settle*24;
|
||||
const base = 160-settle*20;
|
||||
const radius = pile*45+settle*5;
|
||||
lower.setAttribute("d", `M${56.5-radius} ${base} Q40 ${peak+14} 56.5 ${peak} Q70 ${peak+14} ${56.5+radius} ${base} Q75 ${base+settle} 56.5 ${base-settle*5} Q39 ${base+settle} ${56.5-radius} ${base}Z`);
|
||||
shade.setAttribute("d", `M56.5 ${peak} Q70 ${peak+14} ${56.5+radius} ${base} H68Z`);
|
||||
stream.setAttribute("opacity", phase<10.95?".9":"0");
|
||||
thread.setAttribute("d", `M56.5 84 Q${56.5+Math.sin(time*8)*0.5} 101 56.5 ${peak}`);
|
||||
grains.forEach((grain,i)=>{
|
||||
const travel=(time*1.5+i/8)%1;
|
||||
grain.setAttribute("cx", (56.5+Math.sin(i*2.4+time*5)*0.75).toFixed(2));
|
||||
grain.setAttribute("cy", (86+travel*(peak-86)).toFixed(2));
|
||||
});
|
||||
},
|
||||
dispose() { svg.remove(); item.image.classList.remove("hero-replaced"); },
|
||||
};
|
||||
}
|
||||
2
overrides/javascripts/hero-paint-seams.js
Normal file
2
overrides/javascripts/hero-paint-seams.js
Normal file
File diff suppressed because one or more lines are too long
61
overrides/javascripts/hero-planets.js
Normal file
61
overrides/javascripts/hero-planets.js
Normal file
@@ -0,0 +1,61 @@
|
||||
import * as THREE from "./vendor/three/three.module.min.js";
|
||||
import { planets, createPlanet, loadPlanetPaint, disposePlanetPaint } from "./hero-surfaces.js";
|
||||
|
||||
// The illustration supplies composition; each globe is independently lit and rotates fully.
|
||||
export function createPlanets(map, items, onRestore) {
|
||||
const targets=planets.map(d=>({...d,item:items.find(i=>i.image.dataset.heroAsset === 'chapter_'+d.name)})).filter(d=>d.item);
|
||||
const hero=map.closest('.home-div');
|
||||
const renderer=new THREE.WebGLRenderer({alpha:true,antialias:true,powerPreference:'low-power'});
|
||||
renderer.setClearColor(0x000000,0);renderer.domElement.className='hero-objects-canvas';
|
||||
renderer.domElement.setAttribute('aria-hidden','true');
|
||||
renderer.debug.onShaderError=(gl,program,vertex,fragment)=>{throw new Error(`Hero shader: ${gl.getShaderInfoLog(vertex)} ${gl.getShaderInfoLog(fragment)}`);};
|
||||
const scene=new THREE.Scene(),camera=new THREE.OrthographicCamera(-1,1,1,-1,.1,5000);
|
||||
camera.position.z=2000;
|
||||
map.insertBefore(renderer.domElement,map.querySelector(':scope > a'));
|
||||
let width=0,height=0,lost=false,disposed=false,ready=false,lastTime=0;
|
||||
const showOriginal=show=>{
|
||||
renderer.domElement.hidden=show;hero.classList.toggle('hero-three-active',!show);
|
||||
targets.forEach(({item})=>item.image.classList.toggle('hero-replaced',!show));
|
||||
};
|
||||
function resize(){
|
||||
width=map.clientWidth;height=map.clientHeight;
|
||||
renderer.setPixelRatio(Math.min(devicePixelRatio||1,2));
|
||||
renderer.setSize(Math.max(width,1),Math.max(height,1),false);
|
||||
camera.left=-width/2;camera.right=width/2;camera.top=height/2;camera.bottom=-height/2;camera.updateProjectionMatrix();
|
||||
for(const target of targets){const i=target.item.image;target.rect={x:i.offsetLeft,y:i.offsetTop,width:i.offsetWidth,height:i.offsetHeight};
|
||||
}
|
||||
}
|
||||
function render(time,enabled,pointer={x:0,y:0}){
|
||||
if(disposed)return;
|
||||
if(!enabled||lost||!ready||!width||!height){showOriginal(true);return;}
|
||||
const emphasisBlend=time===lastTime?1:1-Math.exp(-Math.min(.1,Math.abs(time-lastTime))*10);lastTime=time;
|
||||
for(const target of targets){
|
||||
const {item,rect,root,sphere,material}=target,selected=item.anchor.classList.contains('hero-selected');
|
||||
root.scale.setScalar(rect.height/Number(item.image.dataset.sourceHeight || item.image.naturalHeight));
|
||||
root.position.set(rect.x+rect.width/2+item.x-width/2,height/2-rect.y-rect.height/2-item.y,0);
|
||||
root.rotation.set(pointer.y*.035,pointer.x*.045,-item.angle*Math.PI/180);
|
||||
sphere.rotation.y=time*Math.PI*2/target.period;
|
||||
if(target.moon)target.moon.rotation.y=sphere.rotation.y*2;
|
||||
material.uniforms.emphasis.value+=((selected?1:0)-material.uniforms.emphasis.value)*emphasisBlend;
|
||||
}
|
||||
renderer.render(scene,camera);showOriginal(false);
|
||||
Object.assign(renderer.domElement.dataset,{drawCalls:String(renderer.info.render.calls),triangles:String(renderer.info.render.triangles),
|
||||
art:'reference-authored-albedo',network:'original-brushwork',rotation:'continuous-360'});
|
||||
}
|
||||
const onLost=event=>{event.preventDefault();lost=true;showOriginal(true);};
|
||||
const onRestored=()=>{lost=false;resize();onRestore();};
|
||||
renderer.domElement.addEventListener('webglcontextlost',onLost);renderer.domElement.addEventListener('webglcontextrestored',onRestored);
|
||||
showOriginal(true);resize();
|
||||
const readyPromise=Promise.allSettled(targets.map(async t=>{await t.item.image.decode();const map=await loadPlanetPaint(t);if(disposed){disposePlanetPaint(map);return;}t.paintMap=map;})).then(results=>{
|
||||
const failure=results.find(r=>r.status==='rejected');if(failure)throw failure.reason;
|
||||
if(disposed)return;
|
||||
for(const target of targets){Object.assign(target,createPlanet(target.item.image,target,target.paintMap));scene.add(target.root);}
|
||||
ready=true;resize();onRestore();
|
||||
}).catch(error=>{if(!disposed){targets.forEach(t=>{disposePlanetPaint(t.paintMap);t.paintMap=null;});showOriginal(true);console.warn('Original planets retained: paint unavailable.',error);}});
|
||||
return {resize,render,ready:readyPromise,dispose(){
|
||||
disposed=true;showOriginal(true);
|
||||
renderer.domElement.removeEventListener('webglcontextlost',onLost);renderer.domElement.removeEventListener('webglcontextrestored',onRestored);
|
||||
const geometries=new Set(),materials=new Set();scene.traverse(o=>{if(o.geometry)geometries.add(o.geometry);if(o.material)materials.add(o.material);});
|
||||
geometries.forEach(g=>g.dispose());materials.forEach(m=>m.dispose());targets.forEach(t=>disposePlanetPaint(t.paintMap));renderer.dispose();renderer.forceContextLoss();renderer.domElement.remove();
|
||||
}};
|
||||
}
|
||||
195
overrides/javascripts/hero-surfaces.js
Normal file
195
overrides/javascripts/hero-surfaces.js
Normal file
@@ -0,0 +1,195 @@
|
||||
import { textureCatalog } from './hero-assets.js';
|
||||
import { paintSeams } from './hero-paint-seams.js';
|
||||
/* Reference-led painted sphere maps and antialiased three-dimensional rings. */
|
||||
import * as T from './vendor/three/three.module.min.js';
|
||||
|
||||
// Palette order: deep ink, secondary pigment, body, accent, paper highlight.
|
||||
// tilt sets the shared polar axis. belt traces a reference latitude in the paint
|
||||
// (top-down y at 9 evenly spaced x positions); beltLevel is its target latitude.
|
||||
// Monotone UV rectification aligns the painted flow over the entire revolution.
|
||||
// Shapes describe the original illustration's visual vocabulary, not its pixels.
|
||||
export const planets = [
|
||||
{name:'array_and_linkedlist',paintWindow:[.1,.62],period:76,tilt:0.59,beltLevel:0.5,belt:[0.5,0.5175,0.59,0.63,0.63,0.58,0.55,0.5025,0.5],colors:['#554f6d','#99748b','#d9bd83','#f3dca0','#fff0bd'],circle:[237,166,130],ring:[237,166,277,51,176],ringStyle:0},
|
||||
{name:'stack_and_queue',period:69,tilt:0.12,beltLevel:0.5,belt:[0.5,0.52,0.6,0.59,0.56,0.5,0.43,0.47,0.5],colors:['#263f56','#438c97','#e4b044','#4fa4a4','#f6ce64']},
|
||||
{name:'hashing',paintWindow:[.04,.96],period:63,tilt:0.69,beltLevel:0.5,belt:[0.5,0.5,0.5,0.5,0.5,0.5,0.5,0.5,0.5],colors:['#294459','#a56870','#4a9e9b','#efad48','#f8d687']},
|
||||
{name:'tree',period:83,tilt:0.28,beltLevel:0.5,belt:[0.5,0.5,0.5,0.5,0.5,0.5,0.5,0.5,0.5],colors:['#264458','#aa866e','#188e84','#cfcc94','#f1d99b']},
|
||||
{name:'heap',period:55,tilt:-0.55,beltLevel:0.5,belt:[0.5,0.4625,0.47,0.57,0.67,0.75,0.65,0.5,0.5],colors:['#273e52','#ad7c99','#b4c67e','#ddab98','#e9d8a0']},
|
||||
{name:'graph',period:89,tilt:0.27,beltLevel:0.5,belt:[0.5,0.535,0.61,0.58,0.54,0.5,0.47,0.485,0.5],colors:['#464464','#786587','#be8d9d','#e3a493','#f2ce9b'],circle:[270,136,135],ring:[270,136,280,9,146],ringStyle:1},
|
||||
{name:'searching',period:58,tilt:0.12,beltLevel:0.5,belt:[0.5,0.5,0.5,0.5,0.5,0.5,0.5,0.5,0.5],colors:['#4b526d','#a7788a','#63a5a0','#a6b28c','#eddb9e']},
|
||||
{name:'sorting',period:52,tilt:-0.5,beltLevel:0.5,belt:[0.5,0.5,0.5,0.5,0.5,0.5,0.5,0.5,0.5],colors:['#3e3d57','#b57191','#eaa9ae','#f6df98','#fff0b5']},
|
||||
{name:'divide_and_conquer',period:94,tilt:0.58,beltLevel:0.5,belt:[0.5,0.5,0.5,0.5,0.5,0.5,0.5,0.5,0.5],colors:['#494a63','#b6777e','#e5a129','#f3c45c','#ffe6a1'],circle:[156,130,117],ring:[203,134,240,60,164],ringStyle:2,moon:[307,50,33]},
|
||||
{name:'backtracking',period:81,tilt:-0.08,beltLevel:0.5,belt:[0.5,0.5,0.5,0.5,0.5,0.5,0.5,0.5,0.5],colors:['#36475c','#727887','#eead30','#c58c4d','#f7d27b'],circle:[166,115,115],ring:[173,159,173,70,126],ringStyle:3},
|
||||
{name:'dynamic_programming',period:67,tilt:0.2,beltLevel:0.5,belt:[0.5,0.5,0.5,0.5,0.5,0.5,0.5,0.5,0.5],colors:['#36394f','#8c4b6d','#d36959','#ed9d46','#f5cb6e']},
|
||||
{name:'greedy',period:72,tilt:-0.57,beltLevel:0.5,belt:[0.5,0.4825,0.51,0.62,0.67,0.67,0.61,0.51,0.5],colors:['#234c60','#32878d','#72b1a7','#b9bd84','#e8ba66'],circle:[135,85,83],ring:[133,101,149,61,111],ringStyle:4},
|
||||
];
|
||||
|
||||
const vertex=`varying vec3 p;varying vec3 n;
|
||||
void main(){p=position;n=normalize(normalMatrix*normal);
|
||||
gl_Position=projectionMatrix*modelViewMatrix*vec4(position,1.);}`;
|
||||
async function loadMap(file) {
|
||||
const map=await new T.TextureLoader().loadAsync(new URL(file,import.meta.url).href);
|
||||
map.colorSpace=T.SRGBColorSpace;map.wrapS=T.RepeatWrapping;
|
||||
map.minFilter=T.LinearMipmapLinearFilter;map.magFilter=T.LinearFilter;map.anisotropy=4;
|
||||
return map;
|
||||
}
|
||||
|
||||
export async function loadPlanetPaint(definition) {
|
||||
const surface=await loadMap(textureCatalog[definition.name].full);
|
||||
try {
|
||||
return {surface,moon:definition.moon?await loadMap(textureCatalog.moon.full):null};
|
||||
} catch(error) {surface.dispose();throw error;}
|
||||
}
|
||||
|
||||
export function disposePlanetPaint(paint) {
|
||||
paint?.surface.dispose();paint?.moon?.dispose();
|
||||
}
|
||||
|
||||
function surface(definition,paintMap) {
|
||||
const seam=paintSeams[definition.name];
|
||||
return new T.ShaderMaterial({uniforms:{pigments:{value:definition.colors.map(c=>new T.Color(c))},paintMap:{value:paintMap},paintWindow:{value:new T.Vector2(...seam.window)},join:{value:seam.join},flowLeft:{value:seam.left},flowRight:{value:seam.right},belt:{value:definition.belt||Array(9).fill(.5)},beltLevel:{value:definition.beltLevel||.5},emphasis:{value:0}},vertexShader:vertex,
|
||||
fragmentShader:`varying vec3 p;varying vec3 n;uniform vec3 pigments[5];uniform float emphasis;uniform vec2 paintWindow;uniform float join[65];uniform float flowLeft[33];uniform float flowRight[33];uniform float belt[9];uniform float beltLevel;uniform sampler2D paintMap;
|
||||
// Cubic paint-space guide with its analytic slope. Keeping derivatives explicit
|
||||
// avoids the atan seam selecting a blurry mip level during a full revolution.
|
||||
vec2 guide(float x){
|
||||
float pos=clamp(x,0.,1.)*8.;int i=min(int(floor(pos)),7);float t=pos-float(i);
|
||||
float a=belt[max(i-1,0)],b=belt[i],c=belt[i+1],d=belt[min(i+2,8)];
|
||||
float A=-a+3.*b-3.*c+d,B=2.*a-5.*b+4.*c-d,C=-a+c;
|
||||
float v=.5*(2.*b+C*t+B*t*t+A*t*t*t);
|
||||
float slope=4.*(C+2.*B*t+3.*A*t*t);
|
||||
return vec2(clamp(v,.04,.96),slope);
|
||||
}
|
||||
vec3 paint(float x,float y,vec2 dx,vec2 dy){
|
||||
vec2 g=guide(x);
|
||||
// An odds-ratio warp maps the traced contour to one latitude. It is smooth,
|
||||
// strictly monotone and fixes both poles: no latitude clipping or mirrored paint.
|
||||
float k=(1.-g.x)*beltLevel/(g.x*(1.-beltLevel));
|
||||
float den=1.-y+k*y;
|
||||
float v=k*y/den;
|
||||
float dvdx=-v*(1.-v)*g.y/(g.x*(1.-g.x));
|
||||
float dvdy=k/(den*den);
|
||||
return textureGrad(paintMap,vec2(x,v),vec2(dx.x,dvdx*dx.x+dvdy*dx.y),vec2(dy.x,dvdx*dy.x+dvdy*dy.y)).rgb;
|
||||
}
|
||||
vec2 edgeFlow(float y,bool left){
|
||||
float row=clamp(y,0.,1.)*32.;int i=min(int(floor(row)),31);
|
||||
float a=left?flowLeft[i]:flowRight[i],b=left?flowLeft[i+1]:flowRight[i+1];
|
||||
return vec2(mix(a,b,row-float(i)),32.*(b-a));
|
||||
}
|
||||
vec3 joinedPaint(float x,float y,vec2 dx,vec2 dy,float longitude,bool left){
|
||||
vec2 flow=edgeFlow(y,left);
|
||||
float t=clamp((abs(longitude)-.012)/.168,0.,1.);
|
||||
float strength=1.-t*t*(3.-2.*t);
|
||||
float slope=-sign(longitude)*6.*t*(1.-t)/.168;
|
||||
float v=mix(y,flow.x,strength),dvdv=mix(1.,flow.y,strength);
|
||||
float dvdu=(flow.x-y)*slope/(paintWindow.y-paintWindow.x);
|
||||
return paint(x,v,vec2(dx.x,dvdu*dx.x+dvdv*dx.y),vec2(dy.x,dvdu*dy.x+dvdv*dy.y));
|
||||
}
|
||||
void main(){vec3 q=normalize(p);
|
||||
// A pigment-matched join follows the paint rather than a vertical fade strip.
|
||||
// Both samples stay inside the authored texture; no wrapped/clamped guide tails.
|
||||
float u=atan(q.x,q.z)/6.28318530718+.5;
|
||||
float y=asin(clamp(q.y,-1.,1.))/3.14159265359+.5;
|
||||
float span=paintWindow.y-paintWindow.x;
|
||||
float x=paintWindow.x+span*u;
|
||||
// Explicit angular derivatives keep mip selection continuous at atan's wrap.
|
||||
float denom=6.28318530718*max(dot(q.xz,q.xz),.0001);
|
||||
vec2 gradX=vec2(span*(q.z*dFdx(q.x)-q.x*dFdx(q.z))/denom,dFdx(y));
|
||||
vec2 gradY=vec2(span*(q.z*dFdy(q.x)-q.x*dFdy(q.z))/denom,dFdy(y));
|
||||
vec3 ink;
|
||||
float signedU=u>.5?u-1.:u;
|
||||
if(abs(signedU)<.18){
|
||||
float row=clamp(y,0.,1.)*64.;int i=min(int(floor(row)),63);
|
||||
float center=mix(join[i],join[i+1],row-float(i));
|
||||
float slope=64.*(join[i+1]-join[i]);
|
||||
float distance=signedU-center;
|
||||
float width=max(.003,abs(gradX.x/span-slope*dFdx(y))+abs(gradY.x/span-slope*dFdy(y)));
|
||||
if(distance < -width)ink=joinedPaint(paintWindow.y+span*signedU,y,gradX,gradY,signedU,true);
|
||||
else if(distance > width)ink=joinedPaint(paintWindow.x+span*signedU,y,gradX,gradY,signedU,false);
|
||||
else{
|
||||
vec3 left=joinedPaint(paintWindow.y+span*signedU,y,gradX,gradY,signedU,true);
|
||||
vec3 right=joinedPaint(paintWindow.x+span*signedU,y,gradX,gradY,signedU,false);
|
||||
ink=mix(left,right,smoothstep(-width,width,distance));
|
||||
}
|
||||
}else ink=paint(x,y,gradX,gradY);
|
||||
// Fixed, restrained illumination preserves the illustration's pigment values.
|
||||
vec3 normal=normalize(n);float light=dot(normal,normalize(vec3(-.60,.80,1.2)));
|
||||
float shade=.72+.28*smoothstep(-.10,.86,light);
|
||||
vec3 color=ink*shade;
|
||||
float rim=1.-smoothstep(.015,.10,normal.z);
|
||||
color=mix(color,pigments[4],rim*(.18+emphasis*.18));
|
||||
color*=1.+emphasis*.04;
|
||||
gl_FragColor=vec4(color,1.);
|
||||
#include <colorspace_fragment>
|
||||
}`});
|
||||
}
|
||||
|
||||
export function createPlanet(image,d,paint) {
|
||||
const w=Number(image.dataset?.sourceWidth || image.naturalWidth),h=Number(image.dataset?.sourceHeight || image.naturalHeight),[cx,cy,r]=d.circle||[w/2,h/2,Math.min(w,h)/2];
|
||||
const root=new T.Group(),axis=new T.Group(),sphere=new T.Mesh(new T.SphereGeometry(1,64,40),surface(d,paint.surface));
|
||||
// Local Y is the polar axis for both the globe and its ring plane. A ring's
|
||||
// apparent minor/major ratio fixes the view elevation, not a separate tilt.
|
||||
const pitch=d.ring?Math.asin(d.ring[3]/d.ring[2]):.08;
|
||||
axis.rotation.set(pitch,0,d.tilt,'ZXY');axis.position.set(cx-w/2,h/2-cy,0);
|
||||
sphere.scale.setScalar(r);axis.add(sphere);root.add(axis);
|
||||
let ring=null;
|
||||
if(d.ring){
|
||||
const [,y,outer,,inner]=d.ring;
|
||||
ring=new T.Mesh(new T.RingGeometry(inner,outer,256),new T.ShaderMaterial({side:T.DoubleSide,transparent:true,depthWrite:false,
|
||||
uniforms:{inner:{value:inner},outer:{value:outer},style:{value:d.ringStyle},ink:{value:new T.Color(d.ringStyle===2?'#c3d3a7':d.ringStyle===4?'#66bcb3':d.ringStyle===3?'#f5b632':d.colors[d.ringStyle===1?2:4])},dark:{value:new T.Color(d.ringStyle===0?'#bca178':d.ringStyle===2?'#986e63':d.ringStyle===4?'#e5b66a':d.ringStyle===3?'#686c80':d.colors[1])}},vertexShader:vertex,
|
||||
fragmentShader:`varying vec3 p;uniform float inner;uniform float outer;uniform float style;uniform vec3 ink;uniform vec3 dark;
|
||||
// Integrate a stroke over its pixel footprint. Unresolved rings become faint
|
||||
// continuous coverage, rather than hard discard dots that shimmer in motion.
|
||||
float stroke(float t,float center,float halfWidth,float pixel){
|
||||
return clamp((t-center+halfWidth)/pixel+.5,0.,1.)-clamp((t-center-halfWidth)/pixel+.5,0.,1.);
|
||||
}
|
||||
void main(){float t=(length(p.xy)-inner)/(outer-inner);
|
||||
float pixel=max(fwidth(t),.0005);float alpha=1.;
|
||||
vec3 color=ink;
|
||||
if(style==0.){
|
||||
// Broad cream ring: a small number of painterly layers, not a sine comb.
|
||||
color=mix(ink,dark,.22*stroke(t,.18,.06,pixel));
|
||||
color=mix(color,dark,.18*stroke(t,.45,.025,pixel));
|
||||
color=mix(color,dark,.12*stroke(t,.66,.04,pixel));
|
||||
color=mix(color,dark,.30*stroke(t,.90,.015,pixel));
|
||||
alpha=1.-.82*stroke(t,.77,.018,pixel);
|
||||
}else if(style==1.){
|
||||
color=mix(dark,ink,.45+.35*smoothstep(.15,.85,t));
|
||||
}else if(style==2.){
|
||||
float first=stroke(t,.12,.027,pixel),middle=stroke(t,.46,.020,pixel),last=stroke(t,.86,.024,pixel);
|
||||
alpha=max(first,max(middle,last));color=mix(ink,dark,.35*last);
|
||||
}else{
|
||||
// Individually drawn, tapered sweeps. The radial curves stay in the
|
||||
// equatorial plane; angular variation gives the original ink character.
|
||||
float a=atan(p.y,p.x),right=cos(a),front=-sin(a);
|
||||
if(style==3.){
|
||||
float warm=smoothstep(-.12,.55,right);
|
||||
float taper=smoothstep(-.96,-.5,cos(a+.45));
|
||||
float main=stroke(t,.48+.035*sin(a+.5),(.035+.095*warm)*taper,pixel);
|
||||
float inside=stroke(t,.14+.03*sin(a),.065*smoothstep(-.4,.65,cos(a+.75)),pixel);
|
||||
float outside=stroke(t,.88+.025*cos(a),.023*smoothstep(-.3,.2,front)*smoothstep(-.95,-.6,right),pixel);
|
||||
alpha=max(main,max(inside,outside));color=mix(dark,ink,warm);
|
||||
}else{
|
||||
float main=stroke(t,.30+.045*sin(a+.4),.067*(.7+.3*cos(a-.5)),pixel);
|
||||
float innerArc=stroke(t,.075+.025*sin(a),.028*smoothstep(-.95,-.35,cos(a-.8)),pixel);
|
||||
float outerArc=stroke(t,.64+.035*cos(a+.4),.040*smoothstep(-.95,-.45,cos(a+1.8)),pixel);
|
||||
float gold=stroke(t,.92+.02*sin(a),.027*smoothstep(-.3,.6,cos(a+.4)),pixel);
|
||||
alpha=max(max(main,innerArc),max(outerArc,gold));
|
||||
color=mix(ink,dark,gold/max(alpha,.001));
|
||||
}
|
||||
}
|
||||
alpha*=smoothstep(0.,pixel,t)*(1.-smoothstep(1.-pixel,1.,t));
|
||||
if(alpha<.001)discard;
|
||||
color*=.90+.10*smoothstep(-outer*.4,outer*.4,p.y);
|
||||
gl_FragColor=vec4(color,alpha);
|
||||
#include <colorspace_fragment>
|
||||
}`}));
|
||||
ring.rotation.x=-Math.PI/2;
|
||||
// Low-set bands in the reference are translated along the same polar axis.
|
||||
ring.position.y=(cy-y)/Math.cos(pitch);axis.add(ring);
|
||||
}
|
||||
let moon=null;
|
||||
if(d.moon){
|
||||
const [x,y,radius]=d.moon;moon=new T.Mesh(new T.SphereGeometry(radius,32,24),surface({...d,name:'moon',belt:Array(9).fill(.5),beltLevel:.5,colors:['#35475a','#b77c94','#659e98','#d9bb87','#eed6ac']},paint.moon));
|
||||
moon.position.set(x-w/2,h/2-y,80);root.add(moon);
|
||||
}
|
||||
return {root,axis,sphere,ring,moon,material:sphere.material};
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 54 KiB |
BIN
overrides/javascripts/hero-textures/backtracking-albedo.webp
Normal file
BIN
overrides/javascripts/hero-textures/backtracking-albedo.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 50 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 88 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 62 KiB |
BIN
overrides/javascripts/hero-textures/graph-albedo.webp
Normal file
BIN
overrides/javascripts/hero-textures/graph-albedo.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 55 KiB |
BIN
overrides/javascripts/hero-textures/greedy-albedo.webp
Normal file
BIN
overrides/javascripts/hero-textures/greedy-albedo.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 69 KiB |
BIN
overrides/javascripts/hero-textures/hashing-albedo.webp
Normal file
BIN
overrides/javascripts/hero-textures/hashing-albedo.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 106 KiB |
BIN
overrides/javascripts/hero-textures/heap-albedo.webp
Normal file
BIN
overrides/javascripts/hero-textures/heap-albedo.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 90 KiB |
BIN
overrides/javascripts/hero-textures/moon-albedo.webp
Normal file
BIN
overrides/javascripts/hero-textures/moon-albedo.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 59 KiB |
BIN
overrides/javascripts/hero-textures/searching-albedo.webp
Normal file
BIN
overrides/javascripts/hero-textures/searching-albedo.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 44 KiB |
BIN
overrides/javascripts/hero-textures/sorting-albedo.webp
Normal file
BIN
overrides/javascripts/hero-textures/sorting-albedo.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 75 KiB |
BIN
overrides/javascripts/hero-textures/stack_and_queue-albedo.webp
Normal file
BIN
overrides/javascripts/hero-textures/stack_and_queue-albedo.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 76 KiB |
BIN
overrides/javascripts/hero-textures/tree-albedo.webp
Normal file
BIN
overrides/javascripts/hero-textures/tree-albedo.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 59 KiB |
44
overrides/javascripts/homepage-media.js
Normal file
44
overrides/javascripts/homepage-media.js
Normal file
@@ -0,0 +1,44 @@
|
||||
/* Below-fold demos load near the viewport and never animate in reduced motion. */
|
||||
(() => {
|
||||
const reduced = matchMedia('(prefers-reduced-motion: reduce)');
|
||||
let observer;
|
||||
const videos = [...document.querySelectorAll('[data-home-video]')];
|
||||
const images = [...document.querySelectorAll('[data-home-src]')];
|
||||
const visible = new Set();
|
||||
function reveal(element) {
|
||||
if (element.dataset.homeSrc && !element.getAttribute('src')) element.src = element.dataset.homeSrc;
|
||||
if (element.dataset.homePoster && !element.getAttribute('poster')) element.poster = element.dataset.homePoster;
|
||||
}
|
||||
function load(video) {
|
||||
if (!video.getAttribute('src')) {
|
||||
video.src = video.dataset.homeVideo;
|
||||
video.load();
|
||||
}
|
||||
}
|
||||
function update() {
|
||||
for (const video of videos) {
|
||||
if (document.hidden || reduced.matches || !visible.has(video)) video.pause();
|
||||
else { load(video); video.play().catch(() => {}); }
|
||||
}
|
||||
}
|
||||
function start() {
|
||||
observer?.disconnect();
|
||||
if (!('IntersectionObserver' in window)) { [...images, ...videos].forEach(reveal); return; }
|
||||
observer = new IntersectionObserver(entries => {
|
||||
for (const entry of entries) {
|
||||
const element = entry.target;
|
||||
if (entry.isIntersecting) reveal(element);
|
||||
if (element.tagName === 'VIDEO') {
|
||||
if (entry.isIntersecting) visible.add(element); else visible.delete(element);
|
||||
} else if (entry.isIntersecting) observer.unobserve(element);
|
||||
}
|
||||
update();
|
||||
}, {rootMargin: '120px 0px'});
|
||||
[...images, ...videos].forEach(element => observer.observe(element));
|
||||
}
|
||||
document.addEventListener('visibilitychange', update);
|
||||
reduced.addEventListener('change', update);
|
||||
addEventListener('pagehide', () => {observer?.disconnect();visible.clear();update();});
|
||||
addEventListener('pageshow', start);
|
||||
start();
|
||||
})();
|
||||
@@ -1,471 +1,321 @@
|
||||
/*
|
||||
* starfield.js
|
||||
*
|
||||
* Version: 1.5.0
|
||||
* Description: Interactive starfield background
|
||||
*
|
||||
* Usage:
|
||||
* Starfield.setup({
|
||||
* // options
|
||||
* });
|
||||
*/
|
||||
(function (root, factory) {
|
||||
if (typeof define === "function" && define.amd) {
|
||||
define([], factory);
|
||||
} else if (typeof module === "object" && module.exports) {
|
||||
module.exports = factory();
|
||||
} else {
|
||||
root.Starfield = factory();
|
||||
}
|
||||
})(this, function () {
|
||||
const Starfield = {};
|
||||
/* Homepage illustration motion. Loaded only by the landing-page build hook. */
|
||||
(function (root) {
|
||||
"use strict";
|
||||
|
||||
const config = {
|
||||
numStars: 250, // Number of stars
|
||||
baseSpeed: 1, // Base speed of stars (will affect acceleration)
|
||||
trailLength: 0.8, // Length of star trail (0-1)
|
||||
starColor: "rgb(255, 255, 255)", // Color of stars (only rgb)
|
||||
canvasColor: "rgb(30, 30, 30)", // Canvas background color (only rgb)
|
||||
hueJitter: 0, // Maximum hue variation in degrees (0-360)
|
||||
maxAcceleration: 10, // Maximum acceleration
|
||||
accelerationRate: 0.2, // Rate of acceleration
|
||||
decelerationRate: 0.2, // Rate of deceleration
|
||||
minSpawnRadius: 80, // Minimum spawn distance from origin
|
||||
maxSpawnRadius: 500, // Maximum spawn distance from origin
|
||||
auto: true,
|
||||
originX: null,
|
||||
originY: null,
|
||||
container: null,
|
||||
originElement: null,
|
||||
};
|
||||
let dispose = () => {};
|
||||
const moduleBase = new URL(".", document.currentScript.src);
|
||||
|
||||
let stars = [];
|
||||
let accelerate = false;
|
||||
let accelerationFactor = 0;
|
||||
let originX = 0;
|
||||
let originY = 0;
|
||||
let prevOriginX = 0;
|
||||
let prevOriginY = 0;
|
||||
function setup(config = {}) {
|
||||
dispose();
|
||||
const container = config.container || document.querySelector(".starfield");
|
||||
const hero = container?.closest(".home-div");
|
||||
const map = hero?.querySelector(".hero-div");
|
||||
if (!map) return;
|
||||
|
||||
let canvas, ctx;
|
||||
let width, height;
|
||||
let lastTimestamp = 0;
|
||||
let canvasRGB = [0, 0, 0];
|
||||
let lastCanvasColor = config.canvasColor;
|
||||
|
||||
let origin;
|
||||
let container;
|
||||
|
||||
const mouseEnterHandler = () => (accelerate = true);
|
||||
const mouseLeaveHandler = () => (accelerate = false);
|
||||
const resizeHandler = () => windowResized(container, origin);
|
||||
|
||||
function visibilityHandler() {
|
||||
if (document.visibilityState === "visible") {
|
||||
lastTimestamp = performance.now();
|
||||
}
|
||||
}
|
||||
|
||||
function getOriginY(origin, container) {
|
||||
const originRect = origin.getBoundingClientRect();
|
||||
const containerRect = container.getBoundingClientRect();
|
||||
return originRect.top - containerRect.top + originRect.height / 2;
|
||||
}
|
||||
|
||||
function getOriginX(origin, container) {
|
||||
const originRect = origin.getBoundingClientRect();
|
||||
const containerRect = container.getBoundingClientRect();
|
||||
return originRect.left - containerRect.left + originRect.width / 2;
|
||||
}
|
||||
|
||||
/**
|
||||
* Set up and start the starfield animation.
|
||||
* @param {Object} userConfig Configuration options.
|
||||
*/
|
||||
function setup(userConfig = {}) {
|
||||
Object.assign(config, userConfig);
|
||||
|
||||
container = config.container || document.querySelector(".starfield");
|
||||
if (!container) {
|
||||
throw new Error("Starfield: No container element found.");
|
||||
}
|
||||
// container.style.position = "relative";
|
||||
|
||||
width = container.clientWidth;
|
||||
height = container.clientHeight;
|
||||
|
||||
canvas = document.createElement("canvas");
|
||||
canvas.width = width;
|
||||
canvas.height = height;
|
||||
|
||||
canvas.style.position = "absolute";
|
||||
canvas.style.top = "0";
|
||||
canvas.style.left = "0";
|
||||
canvas.style.width = "100%";
|
||||
canvas.style.height = "100%";
|
||||
canvas.style.zIndex = "-1";
|
||||
canvasRGB = parseRGBA(config.canvasColor);
|
||||
const reduced = matchMedia("(prefers-reduced-motion: reduce)");
|
||||
const finePointer = matchMedia("(hover: hover) and (pointer: fine)");
|
||||
const mobile = matchMedia("(max-width: 900px)");
|
||||
const listeners = [];
|
||||
const on = (target, type, fn) => {
|
||||
target.addEventListener(type, fn);
|
||||
listeners.push(() => target.removeEventListener(type, fn));
|
||||
};
|
||||
const items = Array.from(map.querySelectorAll(":scope > a")).map((anchor, i) => ({
|
||||
anchor,
|
||||
image: anchor.querySelector("img"),
|
||||
label: anchor.querySelector("span"),
|
||||
originalLabelMargin: anchor.querySelector("span")?.style.marginLeft || "",
|
||||
depth: 0.55 + (i % 4) * 0.15,
|
||||
phase: i * 2.39996,
|
||||
speed: 0.55 + (i % 5) * 0.055,
|
||||
astronaut: anchor.querySelector('img[data-hero-asset="astronaut"]') !== null,
|
||||
x: 0,
|
||||
y: 0,
|
||||
angle: 0,
|
||||
})).filter(item => item.image);
|
||||
const ground = map.querySelector(':scope > img[data-hero-asset="ground"]');
|
||||
const links = map.querySelector(':scope > img[data-hero-asset="links"]');
|
||||
ground?.classList.add("hero-ground");
|
||||
links?.classList.add("hero-links");
|
||||
hero.classList.add("hero-universe");
|
||||
|
||||
const canvas = document.createElement("canvas");
|
||||
canvas.className = "hero-stars";
|
||||
canvas.setAttribute("aria-hidden", "true");
|
||||
container.appendChild(canvas);
|
||||
// Illustration interactions also work if Canvas is unavailable.
|
||||
let ctx = null;
|
||||
try { ctx = canvas.getContext("2d"); } catch (_) { /* Static background remains. */ }
|
||||
|
||||
ctx = canvas.getContext("2d");
|
||||
const lang = (document.documentElement.lang || "zh").toLowerCase();
|
||||
const labels = lang.startsWith("en") ? ["Pause animation", "Play animation"]
|
||||
: lang.startsWith("ja") ? ["アニメーションを一時停止", "アニメーションを再生"]
|
||||
: lang.startsWith("ko") ? ["애니메이션 일시 정지", "애니메이션 재생"]
|
||||
: lang.startsWith("ru") ? ["Приостановить анимацию", "Воспроизвести анимацию"]
|
||||
: /hant|tw/.test(lang) ? ["暫停動畫", "播放動畫"] : ["暂停动画", "播放动画"];
|
||||
const toggle = document.createElement("button");
|
||||
toggle.type = "button";
|
||||
toggle.className = "hero-motion-toggle";
|
||||
toggle.innerHTML = '<svg viewBox="0 0 24 24" aria-hidden="true"><path class="hero-pause-icon" d="M8 6v12M16 6v12"/><path class="hero-play-icon" d="m9 6 9 6-9 6Z"/></svg>';
|
||||
hero.appendChild(toggle);
|
||||
|
||||
if (config.auto) {
|
||||
origin =
|
||||
config.originElement || document.querySelector(".starfield-origin");
|
||||
if (!origin) {
|
||||
throw new Error("Starfield: No origin element found.");
|
||||
let width = 1, height = 1, scale = 1, stars = [];
|
||||
let pointer = { x: 0, y: 0 }, target = { x: 0, y: 0 };
|
||||
let hovered = null, focused = null;
|
||||
let visible = false, suspended = false, destroyed = false;
|
||||
let raf = 0, last = 0, time = 0, paused = false;
|
||||
let planets = null, hourglass = null, objectsRequested = false;
|
||||
try { paused = sessionStorage.getItem("hello-algo:hero-paused") === "true"; } catch (_) { /* Storage is optional. */ }
|
||||
|
||||
const staticMotion = () => reduced.matches || paused;
|
||||
const listLayout = () => mobile.matches && ["hero-div--en", "hero-div--ru", "hero-div--ja"].some(name => map.classList.contains(name));
|
||||
const canRun = () => !destroyed && visible && !suspended && !document.hidden && !staticMotion();
|
||||
const wrap = (n, size) => ((n % size) + size) % size;
|
||||
|
||||
function renderObjects() {
|
||||
const enabled = !reduced.matches && !listLayout();
|
||||
if (planets) {
|
||||
try { planets.render(time, enabled, pointer); }
|
||||
catch (error) {
|
||||
planets.dispose();
|
||||
planets = null;
|
||||
console.warn("Planet rendering unavailable; keeping the original illustrations.", error);
|
||||
}
|
||||
}
|
||||
originX = getOriginX(origin, container);
|
||||
originY = getOriginY(origin, container);
|
||||
|
||||
origin.addEventListener("mouseenter", mouseEnterHandler);
|
||||
origin.addEventListener("mouseleave", mouseLeaveHandler);
|
||||
|
||||
window.addEventListener("resize", resizeHandler);
|
||||
} else {
|
||||
originX = config.originX !== null ? config.originX : width / 2;
|
||||
originY = config.originY !== null ? config.originY : height / 2;
|
||||
hourglass?.render(time, enabled);
|
||||
}
|
||||
|
||||
for (let i = 0; i < config.numStars; i++) {
|
||||
const star = createRandomStar();
|
||||
stars.push(star);
|
||||
function loadObjects() {
|
||||
if (objectsRequested || destroyed || !visible || reduced.matches || listLayout()) return;
|
||||
objectsRequested = true;
|
||||
import(new URL("hero-planets.js", moduleBase).href).then(module => {
|
||||
if (destroyed) return;
|
||||
planets = module.createPlanets(map, items, updatePlayback);
|
||||
renderObjects();
|
||||
resize();
|
||||
}).catch(error => console.warn("3D enhancement unavailable; keeping the original planets.", error));
|
||||
import(new URL("hero-hourglass.js", moduleBase).href).then(module => {
|
||||
if (destroyed) return;
|
||||
hourglass = module.createHourglass(items);
|
||||
renderObjects();
|
||||
}).catch(error => console.warn("Hourglass enhancement unavailable; keeping the original illustration.", error));
|
||||
|
||||
}
|
||||
|
||||
document.addEventListener("visibilitychange", visibilityHandler);
|
||||
|
||||
requestAnimationFrame(draw);
|
||||
}
|
||||
|
||||
function windowResized(container, origin) {
|
||||
width = container.clientWidth;
|
||||
height = container.clientHeight;
|
||||
canvas.width = width;
|
||||
canvas.height = height;
|
||||
|
||||
originX = getOriginX(origin, container);
|
||||
originY = getOriginY(origin, container);
|
||||
|
||||
stars.forEach((star) => star.reset());
|
||||
}
|
||||
|
||||
function createRandomStar() {
|
||||
const angle = random(0, Math.PI * 2);
|
||||
const radius = random(config.minSpawnRadius, config.maxSpawnRadius);
|
||||
|
||||
const x = originX + Math.cos(angle) * radius;
|
||||
const y = originY + Math.sin(angle) * radius;
|
||||
|
||||
return new Star(x, y);
|
||||
}
|
||||
|
||||
class Star {
|
||||
constructor(x, y) {
|
||||
this.pos = {
|
||||
x: x,
|
||||
y: y,
|
||||
};
|
||||
this.prevpos = {
|
||||
x: x,
|
||||
y: y,
|
||||
};
|
||||
this.vel = {
|
||||
x: 0,
|
||||
y: 0,
|
||||
};
|
||||
this.angle = Math.atan2(y - originY, x - originX);
|
||||
this.baseSpeed = random(config.baseSpeed * 0.5, config.baseSpeed * 1.5);
|
||||
this.hueOffset = random(-config.hueJitter, config.hueJitter);
|
||||
}
|
||||
|
||||
reset() {
|
||||
const newStar = createRandomStar();
|
||||
this.pos.x = newStar.pos.x;
|
||||
this.pos.y = newStar.pos.y;
|
||||
this.prevpos.x = this.pos.x;
|
||||
this.prevpos.y = this.pos.y;
|
||||
this.vel.x = 0;
|
||||
this.vel.y = 0;
|
||||
this.angle = Math.atan2(this.pos.y - originY, this.pos.x - originX);
|
||||
this.baseSpeed = random(config.baseSpeed * 0.5, config.baseSpeed * 1.5);
|
||||
this.hueOffset = random(-config.hueJitter, config.hueJitter);
|
||||
}
|
||||
|
||||
update(acc, deltaTime) {
|
||||
const adjustedAcc = acc * this.baseSpeed;
|
||||
|
||||
this.vel.x += Math.cos(this.angle) * adjustedAcc * deltaTime;
|
||||
this.vel.y += Math.sin(this.angle) * adjustedAcc * deltaTime;
|
||||
|
||||
this.prevpos.x = this.pos.x;
|
||||
this.prevpos.y = this.pos.y;
|
||||
this.pos.x += this.vel.x * deltaTime;
|
||||
this.pos.y += this.vel.y * deltaTime;
|
||||
}
|
||||
|
||||
draw() {
|
||||
let velMag = Math.sqrt(
|
||||
this.vel.x * this.vel.x + this.vel.y * this.vel.y
|
||||
);
|
||||
velMag = velMag * 3;
|
||||
const alpha = map(velMag, 0, 10, 0, 1);
|
||||
const weight = map(velMag, 0, 10, 1, 3);
|
||||
|
||||
ctx.lineWidth = weight;
|
||||
|
||||
const [r, g, b] = parseRGBA(config.starColor);
|
||||
const [h, s, l] = rgbToHsl(r, g, b);
|
||||
const adjustedH = (h + this.hueOffset + 360) % 360;
|
||||
const [newR, newG, newB] = hslToRgb(adjustedH, s, l).map((v) =>
|
||||
Math.round(v)
|
||||
);
|
||||
ctx.strokeStyle = `rgba(${newR}, ${newG}, ${newB}, ${alpha})`;
|
||||
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(this.prevpos.x, this.prevpos.y);
|
||||
ctx.lineTo(this.pos.x, this.pos.y);
|
||||
ctx.stroke();
|
||||
}
|
||||
|
||||
isActive() {
|
||||
return onScreen(this.pos.x, this.pos.y);
|
||||
}
|
||||
|
||||
updateAngle() {
|
||||
this.angle = Math.atan2(this.pos.y - originY, this.pos.x - originX);
|
||||
}
|
||||
}
|
||||
|
||||
function draw(timestamp) {
|
||||
if (!lastTimestamp) lastTimestamp = timestamp;
|
||||
const deltaTime = (timestamp - lastTimestamp) / 16.67;
|
||||
lastTimestamp = timestamp;
|
||||
|
||||
if (config.auto) {
|
||||
originX = getOriginX(origin, container);
|
||||
originY = getOriginY(origin, container);
|
||||
if (originX !== prevOriginX || originY !== prevOriginY) {
|
||||
stars.forEach((star) => {
|
||||
star.updateAngle();
|
||||
});
|
||||
prevOriginX = originX;
|
||||
prevOriginY = originY;
|
||||
function drawStars() {
|
||||
if (!ctx) return;
|
||||
ctx.clearRect(0, 0, width, height);
|
||||
for (const star of stars) {
|
||||
const drift = time * star.depth * 0.7;
|
||||
const x = wrap(star.x * width + drift + pointer.x * star.depth * 10, width + 16) - 8;
|
||||
const y = wrap(star.y * height + Math.sin(time * 0.08 + star.phase) * 2 + pointer.y * star.depth * 7, height + 16) - 8;
|
||||
const twinkle = 0.78 + Math.sin(time * star.speed + star.phase) * 0.22;
|
||||
ctx.globalAlpha = star.opacity * twinkle;
|
||||
ctx.fillStyle = star.color;
|
||||
ctx.beginPath();
|
||||
ctx.arc(x, y, star.radius, 0, Math.PI * 2);
|
||||
ctx.fill();
|
||||
if (star.radius > 1.2) {
|
||||
ctx.globalAlpha *= 0.12;
|
||||
ctx.beginPath();
|
||||
ctx.arc(x, y, star.radius * 3, 0, Math.PI * 2);
|
||||
ctx.fill();
|
||||
}
|
||||
}
|
||||
ctx.globalAlpha = 1;
|
||||
}
|
||||
|
||||
if (lastCanvasColor !== config.canvasColor) {
|
||||
canvasRGB = parseRGBA(config.canvasColor);
|
||||
lastCanvasColor = config.canvasColor;
|
||||
}
|
||||
const [bgR, bgG, bgB] = canvasRGB;
|
||||
ctx.fillStyle = `rgba(${bgR}, ${bgG}, ${bgB}, ${1 - config.trailLength})`;
|
||||
ctx.fillRect(0, 0, width, height);
|
||||
|
||||
if (accelerate) {
|
||||
accelerationFactor = Math.min(
|
||||
accelerationFactor + config.accelerationRate * deltaTime,
|
||||
config.maxAcceleration
|
||||
);
|
||||
} else {
|
||||
accelerationFactor = Math.max(
|
||||
accelerationFactor - config.decelerationRate * deltaTime,
|
||||
0
|
||||
);
|
||||
}
|
||||
|
||||
const baseAcc = 0.01;
|
||||
const currentAcc = baseAcc * (1 + accelerationFactor * 10);
|
||||
|
||||
for (let star of stars) {
|
||||
star.update(currentAcc, deltaTime);
|
||||
star.draw();
|
||||
if (!star.isActive()) {
|
||||
star.reset();
|
||||
function moveIllustrations(dt) {
|
||||
const mix = 1 - Math.exp(-dt * 5);
|
||||
pointer.x += (target.x - pointer.x) * mix;
|
||||
pointer.y += (target.y - pointer.y) * mix;
|
||||
const still = staticMotion() || listLayout();
|
||||
const central = item => item.astronaut || item.image.dataset.heroAsset === 'chapter_computational_complexity';
|
||||
const centralSelected = items.some(item => central(item) && (item.anchor === hovered || item.anchor === focused));
|
||||
for (const item of items) {
|
||||
if (central(item)) {
|
||||
if (!still && centralSelected) continue;
|
||||
item.x = still ? 0 : pointer.x * 2 * scale;
|
||||
item.y = still ? 0 : (pointer.y * 1.5 - Math.sin(time * .45) * 1.2) * scale;
|
||||
item.angle = 0;
|
||||
item.anchor.style.setProperty('--hero-x', `${item.x.toFixed(2)}px`);
|
||||
item.anchor.style.setProperty('--hero-y', `${item.y.toFixed(2)}px`);
|
||||
item.anchor.style.setProperty('--hero-angle', '0deg');
|
||||
continue;
|
||||
}
|
||||
// Freeze the selected object so the pointer/keyboard target stays easy to use.
|
||||
if (!still && (item.anchor === hovered || item.anchor === focused)) continue;
|
||||
const amplitude = (item.astronaut ? 5 : 2.6) * scale;
|
||||
const x = (pointer.x * 7 * item.depth + Math.sin(time * item.speed * 0.7 + item.phase) * 1.4) * scale;
|
||||
const y = pointer.y * 5 * item.depth * scale + Math.sin(time * item.speed + item.phase) * amplitude;
|
||||
const angle = Math.sin(time * item.speed * 0.65 + item.phase) * (item.astronaut ? 0.65 : 0.35);
|
||||
item.x = still ? 0 : item.x + (x - item.x) * mix;
|
||||
item.y = still ? 0 : item.y + (y - item.y) * mix;
|
||||
item.angle = still ? 0 : item.angle + (angle - item.angle) * mix;
|
||||
item.anchor.style.setProperty("--hero-x", `${item.x.toFixed(2)}px`);
|
||||
item.anchor.style.setProperty("--hero-y", `${item.y.toFixed(2)}px`);
|
||||
item.anchor.style.setProperty("--hero-angle", `${item.angle.toFixed(3)}deg`);
|
||||
}
|
||||
map.style.setProperty("--hero-ground-x", `${(still ? 0 : pointer.x * 2 * scale).toFixed(2)}px`);
|
||||
map.style.setProperty("--hero-ground-y", `${(still ? 0 : pointer.y * 1.5 * scale).toFixed(2)}px`);
|
||||
}
|
||||
|
||||
requestAnimationFrame(draw);
|
||||
}
|
||||
|
||||
function onScreen(x, y) {
|
||||
return x >= 0 && x <= width && y >= 0 && y <= height;
|
||||
}
|
||||
|
||||
function random(min, max) {
|
||||
return Math.random() * (max - min) + min;
|
||||
}
|
||||
|
||||
// https://gist.github.com/mjackson/5311256
|
||||
function rgbToHsl(r, g, b) {
|
||||
r /= 255;
|
||||
g /= 255;
|
||||
b /= 255;
|
||||
const max = Math.max(r, g, b),
|
||||
min = Math.min(r, g, b);
|
||||
let h,
|
||||
s,
|
||||
l = (max + min) / 2;
|
||||
|
||||
if (max === min) {
|
||||
h = s = 0;
|
||||
} else {
|
||||
const d = max - min;
|
||||
s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
|
||||
switch (max) {
|
||||
case r:
|
||||
h = (g - b) / d + (g < b ? 6 : 0);
|
||||
break;
|
||||
case g:
|
||||
h = (b - r) / d + 2;
|
||||
break;
|
||||
case b:
|
||||
h = (r - g) / d + 4;
|
||||
break;
|
||||
function frame(now) {
|
||||
raf = 0;
|
||||
if (!hero.isConnected) { dispose(); return; }
|
||||
// A media preference may change before its queued change event is delivered.
|
||||
// Apply its static state before this frame stops scheduling the next one.
|
||||
if (reduced.matches && !hero.classList.contains('hero-motion-paused')) {
|
||||
updatePlayback();
|
||||
return;
|
||||
}
|
||||
h /= 6;
|
||||
if (!canRun()) return;
|
||||
// Cap touch devices at 30 fps. Motion uses elapsed time, not frame count.
|
||||
if (last && now - last < (finePointer.matches ? 14 : 30)) {
|
||||
raf = requestAnimationFrame(frame);
|
||||
return;
|
||||
}
|
||||
const dt = last ? Math.min((now - last) / 1000, 0.05) : 0;
|
||||
last = now;
|
||||
time += dt;
|
||||
moveIllustrations(dt);
|
||||
drawStars();
|
||||
renderObjects();
|
||||
raf = requestAnimationFrame(frame);
|
||||
}
|
||||
|
||||
return [h * 360, s, l];
|
||||
}
|
||||
|
||||
// https://gist.github.com/mjackson/5311256
|
||||
function hslToRgb(h, s, l) {
|
||||
let r, g, b;
|
||||
h = h / 360;
|
||||
|
||||
if (s === 0) {
|
||||
r = g = b = l;
|
||||
} else {
|
||||
const hue2rgb = (p, q, t) => {
|
||||
if (t < 0) t += 1;
|
||||
if (t > 1) t -= 1;
|
||||
if (t < 1 / 6) return p + (q - p) * 6 * t;
|
||||
if (t < 1 / 2) return q;
|
||||
if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6;
|
||||
return p;
|
||||
};
|
||||
|
||||
const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
|
||||
const p = 2 * l - q;
|
||||
r = hue2rgb(p, q, h + 1 / 3);
|
||||
g = hue2rgb(p, q, h);
|
||||
b = hue2rgb(p, q, h - 1 / 3);
|
||||
function updatePlayback() {
|
||||
cancelAnimationFrame(raf);
|
||||
raf = 0;
|
||||
last = 0;
|
||||
toggle.hidden = reduced.matches;
|
||||
toggle.setAttribute("aria-label", labels[paused ? 1 : 0]);
|
||||
toggle.title = labels[paused ? 1 : 0];
|
||||
toggle.dataset.paused = String(paused);
|
||||
hero.classList.toggle("hero-motion-paused", staticMotion());
|
||||
if (reduced.matches) {
|
||||
pointer = { x: 0, y: 0 };
|
||||
target = { x: 0, y: 0 };
|
||||
moveIllustrations(0);
|
||||
}
|
||||
drawStars();
|
||||
renderObjects();
|
||||
loadObjects();
|
||||
if (canRun()) raf = requestAnimationFrame(frame);
|
||||
}
|
||||
|
||||
return [r * 255, g * 255, b * 255];
|
||||
}
|
||||
|
||||
function parseRGBA(color) {
|
||||
const rgbaRegex = /rgba?\((\d+),\s*(\d+),\s*(\d+)/;
|
||||
const match = color.match(rgbaRegex);
|
||||
if (match) {
|
||||
return [
|
||||
parseInt(match[1], 10),
|
||||
parseInt(match[2], 10),
|
||||
parseInt(match[3], 10),
|
||||
];
|
||||
function resize() {
|
||||
width = Math.max(container.clientWidth, 1);
|
||||
height = Math.max(container.clientHeight, 1);
|
||||
scale = Math.min(1, map.clientWidth / 1000);
|
||||
const dpr = Math.min(window.devicePixelRatio || 1, finePointer.matches ? 1.5 : 1);
|
||||
canvas.width = Math.round(width * dpr);
|
||||
canvas.height = Math.round(height * dpr);
|
||||
ctx?.setTransform(dpr, 0, 0, dpr, 0, 0);
|
||||
// Deterministic positions avoid a new constellation on every resize.
|
||||
let seed = 73;
|
||||
const random = () => { seed = (seed * 1664525 + 1013904223) >>> 0; return seed / 4294967296; };
|
||||
const count = Math.min(finePointer.matches ? 300 : 130, Math.max(65, Math.round(width * height / 4200)));
|
||||
stars = Array.from({ length: count }, (_, i) => ({
|
||||
x: random(), y: random(), phase: random() * Math.PI * 2,
|
||||
depth: [0.25, 0.6, 1][i % 3],
|
||||
radius: (0.4 + random() * 0.55) * [0.7, 1, 1.5][i % 3],
|
||||
opacity: 0.2 + random() * 0.45,
|
||||
speed: 0.35 + random() * 0.45,
|
||||
color: ["#d0dedc", "#c5d2e8", "#e3d5bf"][i % 3],
|
||||
}));
|
||||
if (!paused || reduced.matches || listLayout()) moveIllustrations(0);
|
||||
drawStars();
|
||||
planets?.resize();
|
||||
renderObjects();
|
||||
// A page can have no horizontal scroll while absolutely positioned text is clipped.
|
||||
// Leave room for the small pointer displacement on both sides of the actual viewport.
|
||||
const heroBounds = hero.getBoundingClientRect();
|
||||
const left = Math.max(0, heroBounds.left) + 12;
|
||||
const right = Math.min(document.documentElement.clientWidth, heroBounds.right) - 12;
|
||||
for (const item of items) {
|
||||
if (!item.label) continue;
|
||||
item.label.style.marginLeft = item.originalLabelMargin;
|
||||
if (listLayout()) continue;
|
||||
const bounds = item.label.getBoundingClientRect();
|
||||
const nudge = Math.max(left - bounds.left, Math.min(0, right - bounds.right));
|
||||
const base = parseFloat(getComputedStyle(item.label).marginLeft) || 0;
|
||||
if (Math.abs(nudge) > .1) item.label.style.marginLeft = `${base + nudge}px`;
|
||||
}
|
||||
loadObjects();
|
||||
}
|
||||
return [255, 255, 255];
|
||||
}
|
||||
|
||||
function map(value, start1, stop1, start2, stop2) {
|
||||
return ((value - start1) / (stop1 - start1)) * (stop2 - start2) + start2;
|
||||
}
|
||||
function updateSelection() {
|
||||
const selected = focused || hovered;
|
||||
for (const item of items) item.anchor.classList.toggle("hero-selected", item.anchor === selected);
|
||||
map.classList.toggle("hero-network-active", Boolean(selected));
|
||||
if (!canRun()) renderObjects();
|
||||
}
|
||||
|
||||
/**
|
||||
* Set the acceleration state of the starfield.
|
||||
* @param {boolean} state The acceleration state.
|
||||
*/
|
||||
function setAccelerate(state) {
|
||||
accelerate = state;
|
||||
}
|
||||
|
||||
/**
|
||||
* Set the x-coordinate of the origin of the starfield.
|
||||
* @param {number} x The x-coordinate of the origin.
|
||||
*/
|
||||
function setOriginX(x) {
|
||||
originX = x;
|
||||
stars.forEach((star) => {
|
||||
star.angle = Math.atan2(star.pos.y - originY, star.pos.x - originX);
|
||||
on(hero, "pointermove", event => {
|
||||
if (!finePointer.matches || event.pointerType === "touch" || staticMotion()) return;
|
||||
const bounds = hero.getBoundingClientRect();
|
||||
target.x = Math.max(-1, Math.min(1, (event.clientX - bounds.left) / bounds.width * 2 - 1));
|
||||
target.y = Math.max(-1, Math.min(1, (event.clientY - bounds.top) / bounds.height * 2 - 1));
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Set the y-coordinate of the origin of the starfield.
|
||||
* @param {number} y The y-coordinate of the origin.
|
||||
*/
|
||||
function setOriginY(y) {
|
||||
originY = y;
|
||||
stars.forEach((star) => {
|
||||
star.angle = Math.atan2(star.pos.y - originY, star.pos.x - originX);
|
||||
on(hero, "pointerleave", () => { target = { x: 0, y: 0 }; hovered = null; updateSelection(); });
|
||||
for (const item of items) {
|
||||
on(item.anchor, "pointerenter", event => {
|
||||
if (event.pointerType === "touch" || !finePointer.matches) return;
|
||||
hovered = item.anchor;
|
||||
updateSelection();
|
||||
});
|
||||
on(item.anchor, "pointerleave", () => { if (hovered === item.anchor) hovered = null; updateSelection(); });
|
||||
on(item.anchor, "focus", () => { focused = item.anchor; updateSelection(); });
|
||||
on(item.anchor, "blur", () => { focused = null; updateSelection(); });
|
||||
}
|
||||
on(toggle, "click", () => {
|
||||
paused = !paused;
|
||||
try { sessionStorage.setItem("hello-algo:hero-paused", String(paused)); } catch (_) { /* Storage is optional. */ }
|
||||
updatePlayback();
|
||||
});
|
||||
}
|
||||
on(reduced, "change", updatePlayback);
|
||||
on(finePointer, "change", () => { target = { x: 0, y: 0 }; resize(); });
|
||||
on(mobile, "change", resize);
|
||||
on(document, "visibilitychange", updatePlayback);
|
||||
on(window, "pagehide", () => { suspended = true; updatePlayback(); });
|
||||
on(window, "pageshow", () => { suspended = false; updatePlayback(); });
|
||||
|
||||
/**
|
||||
* Set the origin of the starfield to a specific point.
|
||||
* @param {number} x The x-coordinate of the origin.
|
||||
* @param {number} y The y-coordinate of the origin.
|
||||
*/
|
||||
function setOrigin(x, y) {
|
||||
originX = x;
|
||||
originY = y;
|
||||
stars.forEach((star) => {
|
||||
star.angle = Math.atan2(star.pos.y - originY, star.pos.x - originX);
|
||||
const resizeObserver = new ResizeObserver(resize);
|
||||
resizeObserver.observe(hero);
|
||||
resizeObserver.observe(map);
|
||||
const intersectionObserver = new IntersectionObserver(entries => {
|
||||
visible = entries[0].isIntersecting;
|
||||
updatePlayback();
|
||||
});
|
||||
intersectionObserver.observe(hero);
|
||||
|
||||
dispose = () => {
|
||||
destroyed = true;
|
||||
cancelAnimationFrame(raf);
|
||||
resizeObserver.disconnect();
|
||||
intersectionObserver.disconnect();
|
||||
listeners.forEach(remove => remove());
|
||||
planets?.dispose();
|
||||
hourglass?.dispose();
|
||||
canvas.remove();
|
||||
toggle.remove();
|
||||
hero.classList.remove("hero-universe", "hero-motion-paused");
|
||||
map.classList.remove("hero-network-active");
|
||||
map.style.removeProperty("--hero-ground-x");
|
||||
map.style.removeProperty("--hero-ground-y");
|
||||
ground?.classList.remove("hero-ground");
|
||||
links?.classList.remove("hero-links");
|
||||
for (const { anchor, label, originalLabelMargin } of items) {
|
||||
if (label) label.style.marginLeft = originalLabelMargin;
|
||||
anchor.classList.remove("hero-selected");
|
||||
["--hero-x", "--hero-y", "--hero-angle"].forEach(name => anchor.style.removeProperty(name));
|
||||
}
|
||||
};
|
||||
resize();
|
||||
updatePlayback();
|
||||
}
|
||||
|
||||
/**
|
||||
* Resize the starfield to a new width and height.
|
||||
* @param {number} newWidth The new width of the starfield.
|
||||
* @param {number} newHeight The new height of the starfield.
|
||||
*/
|
||||
function resize(newWidth, newHeight) {
|
||||
width = newWidth;
|
||||
height = newHeight;
|
||||
canvas.width = width;
|
||||
canvas.height = height;
|
||||
|
||||
if (config.originY !== null) {
|
||||
originY = config.originY;
|
||||
} else {
|
||||
originY = height / 2;
|
||||
}
|
||||
|
||||
stars.forEach((star) => star.reset());
|
||||
}
|
||||
|
||||
function cleanup() {
|
||||
if (origin) {
|
||||
origin.removeEventListener("mouseenter", mouseEnterHandler);
|
||||
origin.removeEventListener("mouseleave", mouseLeaveHandler);
|
||||
}
|
||||
window.removeEventListener("resize", resizeHandler);
|
||||
document.removeEventListener("visibilitychange", visibilityHandler);
|
||||
|
||||
if (canvas && canvas.parentNode) {
|
||||
canvas.parentNode.removeChild(canvas);
|
||||
}
|
||||
|
||||
stars = [];
|
||||
accelerate = false;
|
||||
accelerationFactor = 0;
|
||||
originX = 0;
|
||||
originY = 0;
|
||||
prevOriginX = 0;
|
||||
prevOriginY = 0;
|
||||
lastTimestamp = 0;
|
||||
}
|
||||
|
||||
Starfield.setup = setup;
|
||||
Starfield.setAccelerate = setAccelerate;
|
||||
Starfield.setOrigin = setOrigin;
|
||||
Starfield.setOriginX = setOriginX;
|
||||
Starfield.setOriginY = setOriginY;
|
||||
Starfield.resize = resize;
|
||||
Starfield.config = config;
|
||||
Starfield.cleanup = cleanup;
|
||||
|
||||
return Starfield;
|
||||
});
|
||||
// Retain the build hook's entry point; all motion shares one cancellable loop.
|
||||
root.Starfield = { setup, cleanup: () => dispose() };
|
||||
})(window);
|
||||
|
||||
21
overrides/javascripts/vendor/three/LICENSE
vendored
Normal file
21
overrides/javascripts/vendor/three/LICENSE
vendored
Normal file
@@ -0,0 +1,21 @@
|
||||
The MIT License
|
||||
|
||||
Copyright © 2010-2025 three.js authors
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in
|
||||
all copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
||||
THE SOFTWARE.
|
||||
20
overrides/javascripts/vendor/three/package.json
vendored
Normal file
20
overrides/javascripts/vendor/three/package.json
vendored
Normal file
@@ -0,0 +1,20 @@
|
||||
{
|
||||
"name": "three",
|
||||
"version": "0.180.0",
|
||||
"license": "MIT",
|
||||
"repository": "https://github.com/mrdoob/three.js",
|
||||
"files": {
|
||||
"three.module.min.js": {
|
||||
"url": "https://cdn.jsdelivr.net/npm/three@0.180.0/build/three.module.min.js",
|
||||
"sha256": "e2b5ee6bccd38fd6d8a2428546b83c5f2426d84b152ef82be8055556e3b40eb6"
|
||||
},
|
||||
"three.core.min.js": {
|
||||
"url": "https://cdn.jsdelivr.net/npm/three@0.180.0/build/three.core.min.js",
|
||||
"sha256": "61ba0df005b05991361d040d8ff670e1aadfd0ce7aeebd1fdb0725957a8957de"
|
||||
},
|
||||
"LICENSE": {
|
||||
"url": "https://cdn.jsdelivr.net/npm/three@0.180.0/LICENSE",
|
||||
"sha256": "bfe119ea4fd413f5f7ca3fcd63adb0c4a073ed39daa2fe7d3e6b769e21272601"
|
||||
}
|
||||
}
|
||||
}
|
||||
6
overrides/javascripts/vendor/three/three.core.min.js
vendored
Normal file
6
overrides/javascripts/vendor/three/three.core.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
6
overrides/javascripts/vendor/three/three.module.min.js
vendored
Normal file
6
overrides/javascripts/vendor/three/three.module.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
@@ -134,7 +134,7 @@
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .animation-controls {
|
||||
background: color-mix(in srgb, var(--md-code-bg-color) 91%, black 9%);
|
||||
background: var(--md-code-bg-color);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .animation-controls__button:hover,
|
||||
@@ -148,7 +148,7 @@
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-typeset .tabbed-set[data-auto-slide="true"] > .tabbed-content {
|
||||
background: var(--md-code-bg-color);
|
||||
background: var(--md-default-bg-color);
|
||||
}
|
||||
|
||||
@media screen and (max-width: 44.9375em) {
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
|
||||
/* Theme tokens */
|
||||
/* https://github.com/squidfunk/mkdocs-material/blob/6b5035f5580f97532d664e3d1babf5f320e88ee9/src/assets/stylesheets/main/_colors.scss */
|
||||
/* https://squidfunk.github.io/mkdocs-material/setup/changing-the-colors/#custom-colors */
|
||||
@@ -29,35 +30,71 @@
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] {
|
||||
--theme-dark-base: #1e1e1e;
|
||||
--theme-dark-mantle: #1a1a1a;
|
||||
--theme-dark-crust: #171717;
|
||||
--theme-dark-base: #171717;
|
||||
--theme-dark-surface: #1e1e1e;
|
||||
--theme-dark-overlay: #252525;
|
||||
/* Neutral reading hierarchy shared with the dark SVG palette. */
|
||||
--theme-dark-text: #dcdcdc;
|
||||
--theme-dark-text-strong: #eeeeee;
|
||||
--theme-dark-text-secondary: #c1c1c1;
|
||||
--theme-dark-text-muted: #a5a5a5;
|
||||
--hero-starfield-bg-color: var(--theme-dark-base);
|
||||
|
||||
--md-primary-fg-color: var(--theme-dark-base);
|
||||
--md-primary-bg-color: #adbac7;
|
||||
--md-primary-bg-color: var(--theme-dark-text);
|
||||
|
||||
--md-default-fg-color: #adbac7;
|
||||
--md-default-fg-color: var(--theme-dark-text);
|
||||
--md-default-fg-color--light: var(--theme-dark-text-secondary);
|
||||
--md-default-fg-color--lighter: rgb(220 220 220 / 0.32);
|
||||
--md-default-fg-color--lightest: rgb(220 220 220 / 0.12);
|
||||
--md-default-bg-color: var(--theme-dark-base);
|
||||
--md-default-bg-color--light: rgb(30 30 30 / 0.8);
|
||||
--md-default-bg-color--light: color-mix(in srgb, var(--theme-dark-base) 80%, transparent);
|
||||
|
||||
--md-body-bg-color: var(--md-default-bg-color);
|
||||
--md-header-bg-color: rgba(26, 26, 26, 0.8);
|
||||
--md-header-bg-color: var(--md-default-bg-color--light);
|
||||
|
||||
--md-code-fg-color: #adbac7;
|
||||
--md-code-bg-color: var(--theme-dark-crust);
|
||||
--md-code-fg-color: var(--theme-dark-text);
|
||||
--md-code-hl-comment-color: var(--theme-dark-text-muted);
|
||||
--md-code-hl-variable-color: var(--theme-dark-text);
|
||||
--md-code-hl-punctuation-color: var(--theme-dark-text-secondary);
|
||||
--md-code-hl-operator-color: var(--theme-dark-text-secondary);
|
||||
--md-code-hl-generic-color: var(--theme-dark-text-secondary);
|
||||
--md-code-bg-color: var(--theme-dark-surface);
|
||||
--md-code-bg-color--light: color-mix(in srgb, var(--theme-dark-surface) 70%, transparent);
|
||||
--md-code-bg-color--lighter: color-mix(in srgb, var(--theme-dark-surface) 30%, transparent);
|
||||
|
||||
--md-typeset-color: #adbac7;
|
||||
--md-typeset-color: var(--theme-dark-text);
|
||||
--md-typeset-a-color: #52bbb1;
|
||||
--md-accent-fg-color: var(--md-typeset-a-color);
|
||||
|
||||
--md-typeset-btn-color: #52bbb1;
|
||||
--md-typeset-btn-hover-color: #55aea6;
|
||||
|
||||
--md-footer-fg-color: #adbac7;
|
||||
--md-footer-bg-color: var(--theme-dark-mantle);
|
||||
--md-footer-fg-color: var(--theme-dark-text-secondary);
|
||||
--md-footer-bg-color: var(--theme-dark-base);
|
||||
--md-footer-bg-color--dark: var(--theme-dark-base);
|
||||
|
||||
--md-admonition-pythontutor-color: var(--md-code-bg-color);
|
||||
|
||||
/* Search uses RGB channels inside its shadow root. */
|
||||
--color-foreground: 220 220 220;
|
||||
--color-background: 37 37 37;
|
||||
--color-background-subtle: 30 30 30;
|
||||
--color-backdrop: 23 23 23;
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-typeset :is(h1, h2, h3, h4, h5, h6) {
|
||||
color: var(--theme-dark-text-strong);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] :is(.md-select__inner, .md-tooltip, .md-tooltip2__inner) {
|
||||
--md-default-bg-color: var(--theme-dark-overlay);
|
||||
background-color: var(--theme-dark-overlay);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-dialog {
|
||||
background-color: var(--theme-dark-overlay);
|
||||
color: var(--md-default-fg-color);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"][data-md-color-primary="black"],
|
||||
@@ -75,7 +112,7 @@ body {
|
||||
}
|
||||
|
||||
html:has(body[data-md-color-scheme="slate"]) {
|
||||
background-color: #1e1e1e;
|
||||
background-color: #171717;
|
||||
}
|
||||
|
||||
html:has(body[data-md-color-scheme="default"]) {
|
||||
@@ -352,6 +389,14 @@ html:has(body[data-md-color-scheme="default"]) {
|
||||
padding-top: 0.4rem;
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-typeset :is(.admonition, details):not(.pythontutor) {
|
||||
background-color: var(--theme-dark-surface);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-typeset :is(.admonition, details):not(.pythontutor) > :is(.admonition-title, summary) {
|
||||
background-color: color-mix(in srgb, var(--hello-algo-callout-color) 10%, var(--theme-dark-surface));
|
||||
}
|
||||
|
||||
[dir="ltr"] .md-typeset :is(.admonition, details):not(.pythontutor) > :is(.admonition-title, summary) {
|
||||
padding-left: 2.4rem;
|
||||
}
|
||||
@@ -393,12 +438,6 @@ html:has(body[data-md-color-scheme="default"]) {
|
||||
mask-image: var(--md-admonition-icon--pythontutor);
|
||||
}
|
||||
|
||||
[data-md-color-scheme="slate"] .md-typeset details.pythontutor[open]> :not(summary),
|
||||
[data-md-color-scheme="slate"] .md-typeset details.pythontutor[open]> :not(summary) :is(p, li, strong, em, sub, sup, code, a) {
|
||||
background-color: #f5f5f5;
|
||||
color: #1d1d20;
|
||||
}
|
||||
|
||||
.md-typeset .tabbed-labels>label {
|
||||
font-size: 0.61rem;
|
||||
}
|
||||
@@ -408,6 +447,8 @@ html:has(body[data-md-color-scheme="default"]) {
|
||||
}
|
||||
|
||||
.pythontutor-iframe {
|
||||
/* The embedded third-party visualizer has its own light canvas. */
|
||||
background-color: #f5f5f5;
|
||||
width: 125%;
|
||||
height: 125%;
|
||||
max-width: 125% !important;
|
||||
@@ -441,7 +482,7 @@ html:has(body[data-md-color-scheme="default"]) {
|
||||
}
|
||||
|
||||
.home-div--black {
|
||||
background-color: #101010;
|
||||
background-color: var(--theme-dark-base, #171717);
|
||||
}
|
||||
|
||||
.home-div[data-md-color-scheme="default"],
|
||||
@@ -812,7 +853,7 @@ a:hover .device-on-hover {
|
||||
margin: 0;
|
||||
padding: 1.25em 2.5em;
|
||||
border-radius: 28px;
|
||||
background-color: #101010;
|
||||
background-color: var(--theme-dark-surface, #1e1e1e);
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
273
overrides/stylesheets/hero-motion.css
Normal file
273
overrides/stylesheets/hero-motion.css
Normal file
@@ -0,0 +1,273 @@
|
||||
/* Shared by the Zensical and legacy landing pages. */
|
||||
:root {
|
||||
--home-universe-bg: #171717;
|
||||
}
|
||||
|
||||
/* Keep the landing header and static/animated scene on the same opaque surface. */
|
||||
.md-header.md-header--landing {
|
||||
background-color: var(--home-universe-bg);
|
||||
backdrop-filter: none;
|
||||
-webkit-backdrop-filter: none;
|
||||
}
|
||||
|
||||
.home-div.home-universe-bg {
|
||||
--hero-starfield-bg-color: var(--home-universe-bg);
|
||||
background-color: var(--home-universe-bg);
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: auto;
|
||||
min-height: calc(min(100svh, 120vw) - 2.4rem);
|
||||
margin-top: 0;
|
||||
padding: 0 0 1rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* Keep the map below the header and let captions grow in their own space.
|
||||
Absolute positioning clipped the map and overlaid its bottom labels on short screens. */
|
||||
.home-div.home-universe-bg > .hero-div {
|
||||
flex: none;
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
aspect-ratio: 4 / 3;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.home-div.home-universe-bg > .heading-div {
|
||||
position: relative;
|
||||
left: auto;
|
||||
bottom: auto;
|
||||
transform: none;
|
||||
padding: 0 .75rem 2rem;
|
||||
}
|
||||
|
||||
.home-div.home-universe-bg > .heading-div p {
|
||||
text-wrap: balance;
|
||||
}
|
||||
|
||||
/* Reserve room for the heading and actions on ordinary desktop screens.
|
||||
Short landscape screens keep a readable map and scroll instead of shrinking it. */
|
||||
@media (min-width: 901px) and (min-height: 640px) {
|
||||
.home-div.home-universe-bg > .hero-div {
|
||||
max-width: min(100%, calc((100svh - 16rem) * 4 / 3));
|
||||
}
|
||||
}
|
||||
|
||||
.hero-universe .starfield {
|
||||
pointer-events: none;
|
||||
background-image:
|
||||
linear-gradient(var(--home-universe-bg) 72px, transparent 200px),
|
||||
radial-gradient(ellipse at 25% 30%, rgba(85, 174, 166, 0.055), transparent 55%),
|
||||
radial-gradient(ellipse at 80% 60%, rgba(130, 144, 187, 0.045), transparent 50%);
|
||||
}
|
||||
|
||||
.hero-universe .hero-stars {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* Drift is independent of hover; selection never changes an object's size. */
|
||||
.hero-universe .hero-div > a > img,
|
||||
.hero-universe .hero-div > a > span {
|
||||
translate: var(--hero-x, 0px) var(--hero-y, 0px);
|
||||
}
|
||||
|
||||
.hero-universe .hero-div > a > img {
|
||||
rotate: var(--hero-angle, 0deg);
|
||||
transition: transform 240ms ease, filter 240ms ease;
|
||||
}
|
||||
|
||||
.hero-universe .hero-ground,
|
||||
.hero-universe .hero-links {
|
||||
translate: var(--hero-ground-x, 0px) var(--hero-ground-y, 0px);
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.hero-universe .hero-links {
|
||||
opacity: .72;
|
||||
transition: filter 300ms ease;
|
||||
}
|
||||
|
||||
.hero-universe .hero-network-active > .hero-links {
|
||||
filter: brightness(1.16) drop-shadow(0 0 2px rgba(126, 207, 196, 0.22));
|
||||
}
|
||||
|
||||
.hero-universe .hero-div > a.hero-selected > img {
|
||||
transform: none;
|
||||
filter: brightness(1.04) drop-shadow(0 0 3px rgba(147, 213, 204, 0.18));
|
||||
}
|
||||
|
||||
.hero-universe .hero-div > a.hero-selected > span {
|
||||
color: var(--md-typeset-btn-color);
|
||||
text-decoration: underline;
|
||||
text-underline-offset: 0.2em;
|
||||
}
|
||||
|
||||
/* The positioned children, rather than the zero-size inline anchor, show focus. */
|
||||
.hero-universe .hero-div > a:focus-visible {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.hero-universe .hero-div > a:focus-visible > span {
|
||||
outline: 2px solid var(--md-typeset-btn-color);
|
||||
outline-offset: 5px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.hero-universe .hero-motion-toggle {
|
||||
position: absolute;
|
||||
bottom: 0.65rem;
|
||||
right: 0.65rem;
|
||||
z-index: 4;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
padding: 11px;
|
||||
border: 1px solid rgba(197, 216, 213, 0.25);
|
||||
border-radius: 50%;
|
||||
background: rgba(30, 30, 30, 0.7);
|
||||
color: #bbceca;
|
||||
cursor: pointer;
|
||||
transition: border-color 200ms ease, color 200ms ease;
|
||||
}
|
||||
|
||||
.hero-universe .hero-motion-toggle:hover,
|
||||
.hero-universe .hero-motion-toggle:focus-visible {
|
||||
color: #e1f3ef;
|
||||
border-color: var(--md-typeset-btn-color);
|
||||
outline: 2px solid var(--md-typeset-btn-color);
|
||||
outline-offset: 3px;
|
||||
}
|
||||
|
||||
.hero-motion-toggle svg {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
fill: none;
|
||||
stroke: currentColor;
|
||||
stroke-width: 1.7;
|
||||
stroke-linecap: round;
|
||||
stroke-linejoin: round;
|
||||
}
|
||||
|
||||
.hero-motion-toggle .hero-play-icon,
|
||||
.hero-motion-toggle[data-paused="true"] .hero-pause-icon,
|
||||
.hero-universe .hero-motion-toggle[hidden] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.hero-motion-toggle[data-paused="true"] .hero-play-icon {
|
||||
display: block;
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.hero-universe .hero-div > a > img,
|
||||
.hero-universe .hero-div > a > span,
|
||||
.hero-universe .hero-ground,
|
||||
.hero-universe .hero-links {
|
||||
translate: none;
|
||||
rotate: none;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
.hero-universe .hero-div > a:hover > img,
|
||||
.hero-universe .hero-div > a.hero-selected > img {
|
||||
transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* The PNG boxes remain the native link hit targets and responsive layout anchors. */
|
||||
.hero-universe .hero-div > a > img.hero-replaced {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.hero-universe .hero-objects-canvas {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.hero-universe .hero-objects-canvas[hidden] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Original art is a complete fallback; labels and hit areas remain native HTML. */
|
||||
.hero-universe .hero-div > img.hero-replaced { opacity: 0; }
|
||||
|
||||
.hero-universe > .hero-objects-canvas { z-index: 0; }
|
||||
|
||||
/* Immediate preference response also covers an already-paused animation clock. */
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.hero-universe .hero-objects-canvas,
|
||||
.hero-universe .hero-motion-toggle { display: none; }
|
||||
.hero-universe .hero-div img.hero-replaced { opacity: 1; }
|
||||
.hero-three-active .hero-stars { visibility: visible; }
|
||||
}
|
||||
|
||||
/* Long localized labels need space beside the new volumetric silhouettes. */
|
||||
.hero-three-active :is(.hero-div--en, .hero-div--ru) > a[href$="chapter_greedy/"] > span {
|
||||
margin-left: -4%;
|
||||
}
|
||||
.hero-three-active :is(.hero-div--en, .hero-div--ru, .hero-div--ja) > a[href$="chapter_stack_and_queue/"] > span {
|
||||
margin-left: 4%;
|
||||
}
|
||||
|
||||
/* Long translated chapter names use readable native links on narrow screens. */
|
||||
@media screen and (min-width: 901px) {
|
||||
/* Keep the original planet silhouettes; move long labels into the open gaps. */
|
||||
.hero-universe :is(.hero-div--en, .hero-div--ru, .hero-div--ja, .hero-div--ko) > a[href$="chapter_introduction/"] > span {
|
||||
margin-top: .6rem;
|
||||
}
|
||||
.hero-universe .hero-div--en > a[href$="chapter_divide_and_conquer/"] > span {
|
||||
margin-left: -4.5%;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 900px) {
|
||||
.home-div.home-universe-bg > :is(.hero-div--en, .hero-div--ru, .hero-div--ja) { aspect-ratio: auto; }
|
||||
.hero-universe .hero-div--ko > a[href$="chapter_introduction/"] > span {
|
||||
left: 48% !important;
|
||||
top: 95% !important;
|
||||
}
|
||||
.hero-universe .hero-div--ko > a[href$="chapter_divide_and_conquer/"] > span {
|
||||
margin-left: -2%;
|
||||
}
|
||||
.home-div:has(> :is(.hero-div--en, .hero-div--ru, .hero-div--ja)) { display: block; height: auto !important; margin-top: 0 !important; padding: .5rem 0 1rem !important; }
|
||||
.home-div > :is(.hero-div--en, .hero-div--ru, .hero-div--ja) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .35rem .5rem; width: calc(100% - 1.5rem); height: auto; margin: .5rem auto 1rem; }
|
||||
.home-div > :is(.hero-div--en, .hero-div--ru, .hero-div--ja) > img { display: none; }
|
||||
.home-div > :is(.hero-div--en, .hero-div--ru, .hero-div--ja) > a { display: flex; align-items: center; gap: .4rem; min-width: 0; min-height: 48px; padding: .3rem .15rem; text-align: left; }
|
||||
.home-div > :is(.hero-div--en, .hero-div--ru, .hero-div--ja) > a > img { position: static; flex-shrink: 0; width: 32px !important; height: 32px !important; object-fit: contain; }
|
||||
.home-div > :is(.hero-div--en, .hero-div--ru, .hero-div--ja) > a > span { position: static; min-width: 0; transform: none; white-space: normal; font-size: 13px; line-height: 1.3; }
|
||||
.home-div > :is(.hero-div--en, .hero-div--ru, .hero-div--ja) + .heading-div { position: relative; left: auto; bottom: auto; transform: none; padding: 0 .75rem; }
|
||||
}
|
||||
|
||||
/* Restore the animated, hand-drawn glass from the accepted motion study. */
|
||||
.hero-universe .hero-div > a > .hero-hourglass {
|
||||
position: absolute;
|
||||
width: auto;
|
||||
aspect-ratio: 113 / 178;
|
||||
overflow: visible;
|
||||
pointer-events: none;
|
||||
translate: var(--hero-x, 0px) var(--hero-y, 0px);
|
||||
rotate: var(--hero-angle, 0deg);
|
||||
transition: transform 240ms ease, filter 240ms ease;
|
||||
}
|
||||
.hero-universe .hero-div > a.hero-selected > .hero-hourglass {
|
||||
transform: none;
|
||||
filter: brightness(1.04) drop-shadow(0 0 3px rgba(147, 213, 204, 0.18));
|
||||
}
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.hero-universe .hero-hourglass { display: none !important; }
|
||||
}
|
||||
|
||||
/* Override legacy :hover scaling, including the still-visible original hit targets. */
|
||||
.hero-universe .hero-div > a:hover > img { transform: none; filter: none; }
|
||||
.hero-universe .hero-div > a.hero-selected > img { filter: brightness(1.04); }
|
||||
|
||||
/* Intrinsic dimensions reserve space without overriding responsive media height. */
|
||||
.home-div .profile-img { height: auto; }
|
||||
.home-div video.intro-image { height: auto; }
|
||||
@@ -1,343 +1,529 @@
|
||||
<!-- Section: hero -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div" style="height: min(100vh, 120vw); position: relative; margin-top:-2.4rem; padding: 0; overflow: hidden;">
|
||||
<!-- hero image -->
|
||||
<!-- <img alt="" class="hero-bg" src="assets/hero/universe_bg.png" /> -->
|
||||
<div class="starfield">
|
||||
<div class="starfield-origin"></div>
|
||||
</div>
|
||||
<div class="hero-div hero-div--ru">
|
||||
<img src="../assets/hero/ground.png" alt="" style="position: absolute; width: auto; height: 26.445%; left: 28.211%; top: 54.145%;">
|
||||
<img src="../assets/hero/links.png" alt="" style="position: absolute; width: auto; height: 78.751%; left: 10.545%; top: 7.326%;">
|
||||
<a href="chapter_introduction/">
|
||||
<img src="../assets/hero/astronaut.png" alt="" style="height: 46.673%; left: 35.413%; top: 24.343%;">
|
||||
<span style="left: 49.244%; top: 22.2%;">Первое знакомство с алгоритмами</span>
|
||||
</a>
|
||||
<a href="chapter_computational_complexity/">
|
||||
<img src="../assets/hero/chapter_computational_complexity.png" alt="" style="height: 12.347%; left: 36.267%; top: 37.653%;">
|
||||
<span style="left: 34.244%; top: 33.919%;">Сложность</span>
|
||||
</a>
|
||||
<a href="chapter_array_and_linkedlist/">
|
||||
<img src="../assets/hero/chapter_array_and_linkedlist.png" alt="" style="height: 22.242%; left: 73.242%; top: 52.481%;">
|
||||
<span style="left: 83.897%; top: 76.259%;">Массивы и списки</span>
|
||||
</a>
|
||||
<a href="chapter_stack_and_queue/">
|
||||
<img src="../assets/hero/chapter_stack_and_queue.png" alt="" style="height: 14.302%; left: 62.646%; top: 77.875%;">
|
||||
<span style="left: 77.571%; top: 91.25%;">Стеки и очереди</span>
|
||||
</a>
|
||||
<a href="chapter_hashing/">
|
||||
<img src="../assets/hero/chapter_hashing.png" alt="" style="height: 15.266%; left: 63.281%; top: 27.933%;">
|
||||
<span style="left: 68.862%; top: 46.292%;">Хеш-таблицы</span>
|
||||
</a>
|
||||
<a href="chapter_tree/">
|
||||
<img src="../assets/hero/chapter_tree.png" alt="" style="height: 19.615%; left: 80.137%; top: 26.678%;">
|
||||
<span style="left: 96.159%; top: 44.8%;">Деревья</span>
|
||||
</a>
|
||||
<a href="chapter_heap/">
|
||||
<img src="../assets/hero/chapter_heap.png" alt="" style="height: 10.566%; left: 77.226%; top: 11.559%;">
|
||||
<span style="left: 88.103%; top: 15.422%;">Кучи</span>
|
||||
</a>
|
||||
<a href="chapter_graph/">
|
||||
<img src="../assets/hero/chapter_graph.png" alt="" style="height: 16.112%; left: 51.854%; top: 5.575%;">
|
||||
<span style="left: 71.195%; top: 6.503%;">Графы</span>
|
||||
</a>
|
||||
<a href="chapter_searching/">
|
||||
<img src="../assets/hero/chapter_searching.png" alt="" style="height: 15.149%; left: 18.185%; top: 16.404%;">
|
||||
<span style="left: 14.556%; top: 20.876%;">Поиск</span>
|
||||
</a>
|
||||
<a href="chapter_sorting/">
|
||||
<img src="../assets/hero/chapter_sorting.png" alt="" style="height: 9.574%; left: 25.409%; top: 40.747%;">
|
||||
<span style="left: 28.805%; top: 53.808%;">Сортировка</span>
|
||||
</a>
|
||||
<a href="chapter_divide_and_conquer/">
|
||||
<img src="../assets/hero/chapter_divide_and_conquer.png" alt="" style="height: 18.681%; left: 32.721%; top: 4.816%;">
|
||||
<span style="left: 28.42%; top: 8.679%;">Разделяй и властвуй</span>
|
||||
</a>
|
||||
<a href="chapter_backtracking/">
|
||||
<img src="../assets/hero/chapter_backtracking.png" alt="" style="height: 17.338%; left: 4.875%; top: 32.925%;">
|
||||
<span style="left: 4.742%; top: 50.113%;">Поиск с возвратом</span>
|
||||
</a>
|
||||
<a href="chapter_dynamic_programming/">
|
||||
<img src="../assets/hero/chapter_dynamic_programming.png" alt="" style="height: 15.47%; left: 9.406%; top: 57.472%;">
|
||||
<span style="left: 6.561%; top: 75.351%;">Динамическое программирование</span>
|
||||
</a>
|
||||
<a href="chapter_greedy/">
|
||||
<img src="../assets/hero/chapter_greedy.png" alt="" style="height: 14.127%; left: 23.132%; top: 75.803%;">
|
||||
<span style="left: 20.619%; top: 86.85%;">Жадные алгоритмы</span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- heading -->
|
||||
<div class="heading-div">
|
||||
<img style="height: min(9vh, 12vw);" src="https://readme-typing-svg.demolab.com/?font=Roboto&weight=400&duration=3500&pause=2000&color=FFF¢er=true&vCenter=true&random=false&width=260&lines=Hello%2C+%D0%90%D0%BB%D0%B3%D0%BE!" alt="" />
|
||||
<div style="pointer-events: auto;">
|
||||
<p style="margin-top: max(-1vh, -2vw); margin-bottom: min(2vh, 3.5vw);">
|
||||
Учебник по структурам данных и алгоритмам с анимированными схемами и кодом, готовым к запуску в один клик
|
||||
</p>
|
||||
<a href="chapter_hello_algo/" class="rounded-button">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
|
||||
<path d="M160 96a96 96 0 1 1 192 0A96 96 0 1 1 160 96zm80 152V512l-48.4-24.2c-20.9-10.4-43.5-17-66.8-19.3l-96-9.6C12.5 457.2 0 443.5 0 427V224c0-17.7 14.3-32 32-32H62.3c63.6 0 125.6 19.6 177.7 56zm32 264V248c52.1-36.4 114.1-56 177.7-56H480c17.7 0 32 14.3 32 32V427c0 16.4-12.5 30.2-28.8 31.8l-96 9.6c-23.2 2.3-45.9 8.9-66.8 19.3L272 512z" />
|
||||
</svg>
|
||||
<span>Начать чтение</span>
|
||||
</a>
|
||||
<a href="https://github.com/krahets/hello-algo" class="rounded-button">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 496 512">
|
||||
<path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3 .3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5 .3-6.2 2.3zm44.2-1.7c-2.9 .7-4.9 2.6-4.6 4.9 .3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3 .7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3 .3 2.9 2.3 3.9 1.6 1 3.6 .7 4.3-.7 .7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3 .7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3 .7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z">
|
||||
</path>
|
||||
</svg>
|
||||
<span>GitHub</span>
|
||||
</a>
|
||||
</div>
|
||||
<!-- arrow -->
|
||||
<div style="text-align: center; margin-top: min(2.5vh, 3.5vw);">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="var(--md-default-fg-color)" height="2vh" viewBox="0 0 384 512">
|
||||
<path d="M169.4 470.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 370.8 224 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 306.7L54.6 265.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z" />
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Generated from the shared homepage template and locale configuration. -->
|
||||
<link href="../assets/home/ad8bb1cc4c28091c/hero-motion.css" rel="stylesheet"/>
|
||||
<noscript>
|
||||
<style>
|
||||
[data-home-src], video[data-home-poster] { display: none; }
|
||||
</style>
|
||||
</noscript>
|
||||
<section class="home-div home-universe-bg" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="starfield">
|
||||
<div class="starfield-origin">
|
||||
</div>
|
||||
</div>
|
||||
<div class="hero-div hero-div--ru" data-home-layout="list">
|
||||
<img alt="" data-hero-asset="ground" data-source-height="380" data-source-width="881" height="380" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/567306c070a6a7e2/ground.webp" style="position: absolute; width: auto; height: 26.445%; left: 28.211%; top: 54.145%;" width="881"/>
|
||||
<img alt="" data-hero-asset="links" data-source-height="1134" data-source-width="1562" height="1134" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/3e50f38a325c1cb5/links.webp" style="position: absolute; width: auto; height: 78.751%; left: 10.545%; top: 7.326%;" width="1562"/>
|
||||
<a href="chapter_introduction/">
|
||||
<img alt="" data-hero-asset="astronaut" data-source-height="672" data-source-width="515" height="672" src="../assets/home/ad8bb1cc4c28091c/../shared/images/8e5eb3b3e3ebd9f7/astronaut.webp" style="height: 46.673%; left: 35.413%; top: 24.343%;" width="515"/>
|
||||
<span style="left: 49.244%; top: 22.2%;">
|
||||
Первое знакомство с алгоритмами
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_computational_complexity/">
|
||||
<img alt="" data-hero-asset="chapter_computational_complexity" data-source-height="178" data-source-width="113" height="178" src="../assets/home/ad8bb1cc4c28091c/../shared/images/2fb425426d1f8d86/chapter_computational_complexity.webp" style="height: 12.347%; left: 36.267%; top: 37.653%;" width="113"/>
|
||||
<span style="left: 34.244%; top: 33.919%;">
|
||||
Сложность
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_array_and_linkedlist/">
|
||||
<img alt="" data-hero-asset="chapter_array_and_linkedlist" data-source-height="319" data-source-width="468" height="319" src="../assets/home/ad8bb1cc4c28091c/../shared/images/5cbbdf7be555d3ef/chapter_array_and_linkedlist.webp" style="height: 22.242%; left: 73.242%; top: 52.481%;" width="468"/>
|
||||
<span style="left: 83.897%; top: 76.259%;">
|
||||
Массивы и списки
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_stack_and_queue/">
|
||||
<img alt="" data-hero-asset="chapter_stack_and_queue" data-source-height="204" data-source-width="204" height="204" src="../assets/home/ad8bb1cc4c28091c/../shared/images/e2667767cf7481bd/chapter_stack_and_queue.webp" style="height: 14.302%; left: 62.646%; top: 77.875%;" width="204"/>
|
||||
<span style="left: 77.571%; top: 91.25%;">
|
||||
Стеки и очереди
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_hashing/">
|
||||
<img alt="" data-hero-asset="chapter_hashing" data-source-height="218" data-source-width="218" height="218" src="../assets/home/ad8bb1cc4c28091c/../shared/images/b108d70a537714cb/chapter_hashing.webp" style="height: 15.266%; left: 63.281%; top: 27.933%;" width="218"/>
|
||||
<span style="left: 68.862%; top: 46.292%;">
|
||||
Хеш-таблицы
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_tree/">
|
||||
<img alt="" data-hero-asset="chapter_tree" data-source-height="281" data-source-width="280" height="281" src="../assets/home/ad8bb1cc4c28091c/../shared/images/8138bb0acecedec4/chapter_tree.webp" style="height: 19.615%; left: 80.137%; top: 26.678%;" width="280"/>
|
||||
<span style="left: 96.159%; top: 44.8%;">
|
||||
Деревья
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_heap/">
|
||||
<img alt="" data-hero-asset="chapter_heap" data-source-height="152" data-source-width="151" height="152" src="../assets/home/ad8bb1cc4c28091c/../shared/images/7586281e6691807a/chapter_heap.webp" style="height: 10.566%; left: 77.226%; top: 11.559%;" width="151"/>
|
||||
<span style="left: 88.103%; top: 15.422%;">
|
||||
Кучи
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_graph/">
|
||||
<img alt="" data-hero-asset="chapter_graph" data-source-height="272" data-source-width="542" height="272" src="../assets/home/ad8bb1cc4c28091c/../shared/images/175a7f2e7c3cf5f0/chapter_graph.webp" style="height: 16.112%; left: 51.854%; top: 5.575%;" width="542"/>
|
||||
<span style="left: 71.195%; top: 6.503%;">
|
||||
Графы
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_searching/">
|
||||
<img alt="" data-hero-asset="chapter_searching" data-source-height="216" data-source-width="216" height="216" src="../assets/home/ad8bb1cc4c28091c/../shared/images/ebfe2b953dbb9d90/chapter_searching.webp" style="height: 15.149%; left: 18.185%; top: 16.404%;" width="216"/>
|
||||
<span style="left: 14.556%; top: 20.876%;">
|
||||
Поиск
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_sorting/">
|
||||
<img alt="" data-hero-asset="chapter_sorting" data-source-height="137" data-source-width="138" height="137" src="../assets/home/ad8bb1cc4c28091c/../shared/images/9d4be68b2680967c/chapter_sorting.webp" style="height: 9.574%; left: 25.409%; top: 40.747%;" width="138"/>
|
||||
<span style="left: 28.805%; top: 53.808%;">
|
||||
Сортировка
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_divide_and_conquer/">
|
||||
<img alt="" data-hero-asset="chapter_divide_and_conquer" data-source-height="269" data-source-width="407" height="269" src="../assets/home/ad8bb1cc4c28091c/../shared/images/6f5766ca9385cd2e/chapter_divide_and_conquer.webp" style="height: 18.681%; left: 32.721%; top: 4.816%;" width="407"/>
|
||||
<span style="left: 28.42%; top: 8.679%;">
|
||||
Разделяй и властвуй
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_backtracking/">
|
||||
<img alt="" data-hero-asset="chapter_backtracking" data-source-height="249" data-source-width="345" height="249" src="../assets/home/ad8bb1cc4c28091c/../shared/images/176675e685febf11/chapter_backtracking.webp" style="height: 17.338%; left: 4.875%; top: 32.925%;" width="345"/>
|
||||
<span style="left: 4.742%; top: 50.113%;">
|
||||
Поиск с возвратом
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_dynamic_programming/">
|
||||
<img alt="" data-hero-asset="chapter_dynamic_programming" data-source-height="268" data-source-width="267" height="268" src="../assets/home/ad8bb1cc4c28091c/../shared/images/06264b1ffd05b08e/chapter_dynamic_programming.webp" style="height: 15.47%; left: 9.406%; top: 57.472%;" width="267"/>
|
||||
<span style="left: 6.561%; top: 75.351%;">
|
||||
Динамическое программирование
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_greedy/">
|
||||
<img alt="" data-hero-asset="chapter_greedy" data-source-height="202" data-source-width="265" height="202" src="../assets/home/ad8bb1cc4c28091c/../shared/images/2ce6caaac951c40b/chapter_greedy.webp" style="height: 14.127%; left: 23.132%; top: 75.803%;" width="265"/>
|
||||
<span style="left: 20.619%; top: 86.85%;">
|
||||
Жадные алгоритмы
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="heading-div">
|
||||
<img alt="" loading="lazy" src="https://readme-typing-svg.demolab.com/?font=Roboto&weight=400&duration=3500&pause=2000&color=FFF&center=true&vCenter=true&random=false&width=260&lines=Hello%2C+%D0%90%D0%BB%D0%B3%D0%BE!" style="height: min(9vh, 12vw);"/>
|
||||
<div style="pointer-events: auto;">
|
||||
<p style="margin-top: max(-1vh, -2vw); margin-bottom: min(2vh, 3.5vw);">
|
||||
Учебник по структурам данных и алгоритмам с анимированными схемами и кодом, готовым к запуску в один клик
|
||||
</p>
|
||||
<a class="rounded-button" href="chapter_hello_algo/">
|
||||
<svg viewbox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
|
||||
<path d="M160 96a96 96 0 1 1 192 0A96 96 0 1 1 160 96zm80 152V512l-48.4-24.2c-20.9-10.4-43.5-17-66.8-19.3l-96-9.6C12.5 457.2 0 443.5 0 427V224c0-17.7 14.3-32 32-32H62.3c63.6 0 125.6 19.6 177.7 56zm32 264V248c52.1-36.4 114.1-56 177.7-56H480c17.7 0 32 14.3 32 32V427c0 16.4-12.5 30.2-28.8 31.8l-96 9.6c-23.2 2.3-45.9 8.9-66.8 19.3L272 512z">
|
||||
</path>
|
||||
</svg>
|
||||
<span>
|
||||
Начать чтение
|
||||
</span>
|
||||
</a>
|
||||
<a class="rounded-button" href="https://github.com/krahets/hello-algo">
|
||||
<svg viewbox="0 0 496 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3 .3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5 .3-6.2 2.3zm44.2-1.7c-2.9 .7-4.9 2.6-4.6 4.9 .3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3 .7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3 .3 2.9 2.3 3.9 1.6 1 3.6 .7 4.3-.7 .7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3 .7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3 .7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z">
|
||||
</path>
|
||||
</svg>
|
||||
<span>
|
||||
GitHub
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<div style="text-align: center; margin-top: min(2.5vh, 3.5vw);">
|
||||
<svg fill="var(--md-default-fg-color)" height="2vh" viewbox="0 0 384 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M169.4 470.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 370.8 224 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 306.7L54.6 265.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z">
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Section: reading -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content">
|
||||
<div class="reading-media">
|
||||
<!-- devices -->
|
||||
<!-- book height = 250 mm -->
|
||||
<!-- mac height = 248.1 mm -->
|
||||
<!-- ipad height = 280.6mm -->
|
||||
<!-- iphone height = 160.7mm -->
|
||||
<div class="media-block">
|
||||
<a href="chapter_hello_algo/">
|
||||
<div style="height: 4.34%;"></div>
|
||||
<img class="device-on-hover" style="height: 66.31%;" src="../assets/hero/web_mac_iphone.png" alt="">
|
||||
<div style="height: 4.34%;"></div>
|
||||
<div class="text-button">
|
||||
<span>Читать онлайн</span>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z" />
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="media-block">
|
||||
<a href="https://github.com/krahets/hello-algo/releases">
|
||||
<img class="device-on-hover" style="height: 75%;" src="../assets/hero/pdf_ipad.png" alt="">
|
||||
<div class="text-button">
|
||||
<span>Скачать PDF/EPUB</span>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z" />
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<p style="margin-top: 2em;">500 анимированных схем, код на 14 языках программирования и 3000 ответов сообщества помогут вам быстро войти в мир структур данных и алгоритмов.</p>
|
||||
</div>
|
||||
<section class="home-div" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="section-content">
|
||||
<div class="reading-media">
|
||||
<div class="media-block">
|
||||
<a href="chapter_hello_algo/">
|
||||
<div style="height: 4.34%;">
|
||||
</div>
|
||||
<img alt="" class="device-on-hover" data-home-src="../assets/home/ad8bb1cc4c28091c/../shared/images/5b64cf7672ec5ec6/web_mac_iphone.webp" decoding="async" height="965" style="height: 66.31%;" width="1598"/>
|
||||
<noscript>
|
||||
<img alt="" class="device-on-hover" height="965" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/5b64cf7672ec5ec6/web_mac_iphone.webp" style="height: 66.31%;" width="1598"/>
|
||||
</noscript>
|
||||
<div style="height: 4.34%;">
|
||||
</div>
|
||||
<div class="text-button">
|
||||
<span>
|
||||
Читать онлайн
|
||||
</span>
|
||||
<svg viewbox="0 0 320 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z">
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="media-block">
|
||||
<a href="https://github.com/krahets/hello-algo/releases">
|
||||
<img alt="" class="device-on-hover" data-home-src="../assets/home/ad8bb1cc4c28091c/../shared/images/66baa2f9bf3abec7/pdf_ipad.webp" decoding="async" height="960" style="height: 75%;" width="812"/>
|
||||
<noscript>
|
||||
<img alt="" class="device-on-hover" height="960" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/66baa2f9bf3abec7/pdf_ipad.webp" style="height: 75%;" width="812"/>
|
||||
</noscript>
|
||||
<div class="text-button">
|
||||
<span>
|
||||
Скачать PDF/EPUB
|
||||
</span>
|
||||
<svg viewbox="0 0 320 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z">
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<p style="margin-top: 2em;">
|
||||
500 анимированных схем, код на 14 языках программирования и 3000 ответов сообщества помогут вам быстро войти в мир структур данных и алгоритмов.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Section: endorsements -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content">
|
||||
<h3 style="text-align: center; margin: 1em auto;">Рекомендации</h3>
|
||||
<div class="intro-container endor-container">
|
||||
<div class="intro-text endor-text">
|
||||
<p style="margin-bottom: 0;">«Понятная вводная книга по структурам данных и алгоритмам, которая ведет читателя через практическое обучение шаг за шагом. Очень рекомендую всем начинающим.»</p>
|
||||
<p style="font-weight: bold;">—— Junhui Deng, профессор факультета компьютерных наук Университета Цинхуа</p>
|
||||
</div>
|
||||
<div class="intro-text endor-text">
|
||||
<p style="margin-bottom: 0;">«Если бы у меня была “Hello Algo”, когда я изучал структуры данных и алгоритмы, учиться было бы в десять раз проще!»</p>
|
||||
<p style="font-weight: bold;">—— Mu Li, Senior Principal Scientist, Amazon</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<section class="home-div" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="section-content">
|
||||
<h3 style="text-align: center; margin: 1em auto;">
|
||||
Рекомендации
|
||||
</h3>
|
||||
<div class="intro-container endor-container">
|
||||
<div class="intro-text endor-text">
|
||||
<p style="margin-bottom: 0;">
|
||||
«Понятная вводная книга по структурам данных и алгоритмам, которая ведет читателя через практическое обучение шаг за шагом. Очень рекомендую всем начинающим.»
|
||||
</p>
|
||||
<p style="font-weight: bold;">
|
||||
—— Junhui Deng, профессор факультета компьютерных наук Университета Цинхуа
|
||||
</p>
|
||||
</div>
|
||||
<div class="intro-text endor-text">
|
||||
<p style="margin-bottom: 0;">
|
||||
«Если бы у меня была “Hello Algo”, когда я изучал структуры данных и алгоритмы, учиться было бы в десять раз проще!»
|
||||
</p>
|
||||
<p style="font-weight: bold;">
|
||||
—— Mu Li, Senior Principal Scientist, Amazon
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Section: features -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content">
|
||||
<div class="intro-container">
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="1.5em" width="1.5em" viewBox="0 0 640 512">
|
||||
<path fill="var(--md-primary-bg-color)" d="M256 0H576c35.3 0 64 28.7 64 64V288c0 35.3-28.7 64-64 64H256c-35.3 0-64-28.7-64-64V64c0-35.3 28.7-64 64-64zM476 106.7C471.5 100 464 96 456 96s-15.5 4-20 10.7l-56 84L362.7 169c-4.6-5.7-11.5-9-18.7-9s-14.2 3.3-18.7 9l-64 80c-5.8 7.2-6.9 17.1-2.9 25.4s12.4 13.6 21.6 13.6h80 48H552c8.9 0 17-4.9 21.2-12.7s3.7-17.3-1.2-24.6l-96-144zM336 96a32 32 0 1 0 -64 0 32 32 0 1 0 64 0zM64 128h96V384v32c0 17.7 14.3 32 32 32H320c17.7 0 32-14.3 32-32V384H512v64c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V192c0-35.3 28.7-64 64-64zm8 64c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V208c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V312c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H72zm336 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H424c-8.8 0-16 7.2-16 16z" />
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">Анимированные схемы</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">Материал изложен ясно и последовательно, поэтому вход в тему получается плавным.</p>
|
||||
<p class="intro-quote">"A picture is worth a thousand words."<br>«Одна схема стоит тысячи слов»</p>
|
||||
</div>
|
||||
</div>
|
||||
<video class="intro-image" src="index.assets/animation.mp4" autoplay loop muted playsinline aria-label="Animation example"></video>
|
||||
</div>
|
||||
|
||||
<div class="intro-container">
|
||||
<video class="intro-image" src="index.assets/running_code.mp4" autoplay loop muted playsinline aria-label="Running code example"></video>
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="1.5em" width="1.5em" viewBox="0 0 640 512">
|
||||
<path fill="var(--md-primary-bg-color)" d="M392.8 1.2c-17-4.9-34.7 5-39.6 22l-128 448c-4.9 17 5 34.7 22 39.6s34.7-5 39.6-22l128-448c4.9-17-5-34.7-22-39.6zm80.6 120.1c-12.5 12.5-12.5 32.8 0 45.3L562.7 256l-89.4 89.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l112-112c12.5-12.5 12.5-32.8 0-45.3l-112-112c-12.5-12.5-32.8-12.5-45.3 0zm-306.7 0c-12.5-12.5-32.8-12.5-45.3 0l-112 112c-12.5 12.5-12.5 32.8 0 45.3l112 112c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256l89.4-89.4c12.5-12.5 12.5-32.8 0-45.3z" />
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">Запуск в один клик</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">Код на более чем десяти языках можно запускать и визуализировать прямо в книге.</p>
|
||||
<p class="intro-quote">"Talk is cheap. Show me the code."<br>«Меньше слов, больше кода»</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="intro-container">
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="1.5em" width="1.5em" viewBox="0 0 640 512">
|
||||
<path fill="var(--md-primary-bg-color)" d="M88.2 309.1c9.8-18.3 6.8-40.8-7.5-55.8C59.4 230.9 48 204 48 176c0-63.5 63.8-128 160-128s160 64.5 160 128s-63.8 128-160 128c-13.1 0-25.8-1.3-37.8-3.6c-10.4-2-21.2-.6-30.7 4.2c-4.1 2.1-8.3 4.1-12.6 6c-16 7.2-32.9 13.5-49.9 18c2.8-4.6 5.4-9.1 7.9-13.6c1.1-1.9 2.2-3.9 3.2-5.9zM0 176c0 41.8 17.2 80.1 45.9 110.3c-.9 1.7-1.9 3.5-2.8 5.1c-10.3 18.4-22.3 36.5-36.6 52.1c-6.6 7-8.3 17.2-4.6 25.9C5.8 378.3 14.4 384 24 384c43 0 86.5-13.3 122.7-29.7c4.8-2.2 9.6-4.5 14.2-6.8c15.1 3 30.9 4.5 47.1 4.5c114.9 0 208-78.8 208-176S322.9 0 208 0S0 78.8 0 176zM432 480c16.2 0 31.9-1.6 47.1-4.5c4.6 2.3 9.4 4.6 14.2 6.8C529.5 498.7 573 512 616 512c9.6 0 18.2-5.7 22-14.5c3.8-8.8 2-19-4.6-25.9c-14.2-15.6-26.2-33.7-36.6-52.1c-.9-1.7-1.9-3.4-2.8-5.1C622.8 384.1 640 345.8 640 304c0-94.4-87.9-171.5-198.2-175.8c4.1 15.2 6.2 31.2 6.2 47.8l0 .6c87.2 6.7 144 67.5 144 127.4c0 28-11.4 54.9-32.7 77.2c-14.3 15-17.3 37.6-7.5 55.8c1.1 2 2.2 4 3.2 5.9c2.5 4.5 5.2 9 7.9 13.6c-17-4.5-33.9-10.7-49.9-18c-4.3-1.9-8.5-3.9-12.6-6c-9.5-4.8-20.3-6.2-30.7-4.2c-12.1 2.4-24.7 3.6-37.8 3.6c-61.7 0-110-26.5-136.8-62.3c-16 5.4-32.8 9.4-50 11.8C279 439.8 350 480 432 480z" />
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">Учимся вместе</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">Добро пожаловать к обсуждениям и вопросам: продвигаться вместе проще.</p>
|
||||
<p class="intro-quote">"Learning by teaching."<br>«Обучая других, учишься сам»</p>
|
||||
</div>
|
||||
</div>
|
||||
<video class="intro-image" src="index.assets/comment.mp4" autoplay loop muted playsinline aria-label="Comments example"></video>
|
||||
</div>
|
||||
|
||||
<section class="home-div" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="section-content">
|
||||
<div class="intro-container">
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg height="1.5em" viewbox="0 0 640 512" width="1.5em" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M256 0H576c35.3 0 64 28.7 64 64V288c0 35.3-28.7 64-64 64H256c-35.3 0-64-28.7-64-64V64c0-35.3 28.7-64 64-64zM476 106.7C471.5 100 464 96 456 96s-15.5 4-20 10.7l-56 84L362.7 169c-4.6-5.7-11.5-9-18.7-9s-14.2 3.3-18.7 9l-64 80c-5.8 7.2-6.9 17.1-2.9 25.4s12.4 13.6 21.6 13.6h80 48H552c8.9 0 17-4.9 21.2-12.7s3.7-17.3-1.2-24.6l-96-144zM336 96a32 32 0 1 0 -64 0 32 32 0 1 0 64 0zM64 128h96V384v32c0 17.7 14.3 32 32 32H320c17.7 0 32-14.3 32-32V384H512v64c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V192c0-35.3 28.7-64 64-64zm8 64c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V208c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V312c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H72zm336 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H424c-8.8 0-16 7.2-16 16z" fill="var(--md-primary-bg-color)">
|
||||
</path>
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">
|
||||
Анимированные схемы
|
||||
</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">
|
||||
Материал изложен ясно и последовательно, поэтому вход в тему получается плавным.
|
||||
</p>
|
||||
<p class="intro-quote">
|
||||
"A picture is worth a thousand words."
|
||||
<br/>
|
||||
«Одна схема стоит тысячи слов»
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Section: contributors -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content" style="max-width: 90vw;">
|
||||
<!-- author -->
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>Автор</h3>
|
||||
<div class="profile-div" style="gap: 1.25em; justify-content: center;">
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/krahets">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_yudongjin.jpg" alt="Author: yudongjin" />
|
||||
<br><b>Yudong Jin (@krahets)</b>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- translator -->
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>Переводчики</h3>
|
||||
<p>Русская печатная версия была переведена И. А. Шевкун, а русская онлайн-версия была вычитана Yuyan Huang. Благодарим их за вклад!</p>
|
||||
<div class="profile-div translator-profile-div">
|
||||
<div class="profile-cell translator-profile-cell">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_shevkun.jpg" alt="Translator: shevkun" />
|
||||
<br><b>И. А. Шевкун</b>
|
||||
</div>
|
||||
<div class="profile-cell translator-profile-cell">
|
||||
<a href="https://github.com/veronicahuang2977">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_yuyanhuang.jpg" alt="Translator: yuyanhuang" />
|
||||
<br><b>Yuyan Huang</b>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- code reviewers -->
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>Ревьюеры кода</h3>
|
||||
<p>Многоязычные версии кода в этой книге были подготовлены при участии следующих разработчиков. Благодарим их за время и вклад!</p>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/coderonion">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_coderonion.jpg" alt="Reviewer: coderonion" />
|
||||
<br><b>coderonion</b>
|
||||
<br><sub>Zig, Rust</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/curtishd">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_curtishd.jpg" alt="Reviewer: curtishd" />
|
||||
<br><b>curtishd</b>
|
||||
<br><sub>Kotlin</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/Gonglja">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_Gonglja.jpg" alt="Reviewer: Gonglja" />
|
||||
<br><b>Gonglja</b>
|
||||
<br><sub>C, C++</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/gvenusleo">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_gvenusleo.jpg" alt="Reviewer: gvenusleo" />
|
||||
<br><b>gvenusleo</b>
|
||||
<br><sub>Dart</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/hpstory">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_hpstory.jpg" alt="Reviewer: hpstory" />
|
||||
<br><b>hpstory</b>
|
||||
<br><sub>C#</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/justin-tse">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_justin-tse.jpg" alt="Reviewer: justin-tse" />
|
||||
<br><b>justin-tse</b>
|
||||
<br><sub>JS, TS</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/khoaxuantu">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_khoaxuantu.jpg" alt="Reviewer: khoaxuantu" />
|
||||
<br><b>khoaxuantu</b>
|
||||
<br><sub>Ruby</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/krahets">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_krahets.jpg" alt="Reviewer: krahets" />
|
||||
<br><b>krahets</b>
|
||||
<br><sub>Python, Java</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/night-cruise">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_night-cruise.jpg" alt="Reviewer: night-cruise" />
|
||||
<br><b>night-cruise</b>
|
||||
<br><sub>Rust</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/nuomi1">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_nuomi1.jpg" alt="Reviewer: nuomi1" />
|
||||
<br><b>nuomi1</b>
|
||||
<br><sub>Swift</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/Reanon">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_Reanon.jpg" alt="Reviewer: Reanon" />
|
||||
<br><b>Reanon</b>
|
||||
<br><sub>Go, C</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/rongyi">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_rongyi.jpg" alt="Reviewer: rongyi" />
|
||||
<br><b>rongyi</b>
|
||||
<br><sub>Rust</sub>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- contributors -->
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>Участники проекта</h3>
|
||||
<p>Книга постоянно совершенствуется благодаря совместным усилиям более чем 200 участников сообщества. Спасибо им за время и вклад!</p>
|
||||
<a href="https://github.com/krahets/hello-algo/graphs/contributors">
|
||||
<img src="https://contrib.rocks/image?repo=krahets/hello-algo&max=300&columns=12" alt="Contributors" style="width: 100%; max-width: 38.5em;">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<video aria-label="Animation example" class="intro-image" data-home-poster="../assets/home/ad8bb1cc4c28091c/../shared/images/9e5f39bf33afc70f/animation-poster.webp" data-home-video="../assets/home/ad8bb1cc4c28091c/../shared/media/6c70de2b2bf4eef7/animation.mp4" height="1080" loop="" muted="" playsinline="" preload="none" style="aspect-ratio: 1600 / 1080" width="1600">
|
||||
</video>
|
||||
<noscript>
|
||||
<a href="../assets/home/ad8bb1cc4c28091c/../shared/media/6c70de2b2bf4eef7/animation.mp4">
|
||||
<img alt="Animation example" class="intro-image" height="1080" src="../assets/home/ad8bb1cc4c28091c/../shared/images/9e5f39bf33afc70f/animation-poster.webp" width="1600"/>
|
||||
Анимированные схемы
|
||||
</a>
|
||||
</noscript>
|
||||
</div>
|
||||
<div class="intro-container">
|
||||
<video aria-label="Running code example" class="intro-image" data-home-poster="../assets/home/ad8bb1cc4c28091c/../shared/images/f33a13e8331245ae/running_code-poster.webp" data-home-video="../assets/home/ad8bb1cc4c28091c/../shared/media/bb169a96ca8316da/running_code.mp4" height="1082" loop="" muted="" playsinline="" preload="none" style="aspect-ratio: 1600 / 1082" width="1600">
|
||||
</video>
|
||||
<noscript>
|
||||
<a href="../assets/home/ad8bb1cc4c28091c/../shared/media/bb169a96ca8316da/running_code.mp4">
|
||||
<img alt="Running code example" class="intro-image" height="1082" src="../assets/home/ad8bb1cc4c28091c/../shared/images/f33a13e8331245ae/running_code-poster.webp" width="1600"/>
|
||||
Запуск в один клик
|
||||
</a>
|
||||
</noscript>
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg height="1.5em" viewbox="0 0 640 512" width="1.5em" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M392.8 1.2c-17-4.9-34.7 5-39.6 22l-128 448c-4.9 17 5 34.7 22 39.6s34.7-5 39.6-22l128-448c4.9-17-5-34.7-22-39.6zm80.6 120.1c-12.5 12.5-12.5 32.8 0 45.3L562.7 256l-89.4 89.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l112-112c12.5-12.5 12.5-32.8 0-45.3l-112-112c-12.5-12.5-32.8-12.5-45.3 0zm-306.7 0c-12.5-12.5-32.8-12.5-45.3 0l-112 112c-12.5 12.5-12.5 32.8 0 45.3l112 112c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256l89.4-89.4c12.5-12.5 12.5-32.8 0-45.3z" fill="var(--md-primary-bg-color)">
|
||||
</path>
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">
|
||||
Запуск в один клик
|
||||
</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">
|
||||
Код на более чем десяти языках можно запускать и визуализировать прямо в книге.
|
||||
</p>
|
||||
<p class="intro-quote">
|
||||
"Talk is cheap. Show me the code."
|
||||
<br/>
|
||||
«Меньше слов, больше кода»
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="intro-container">
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg height="1.5em" viewbox="0 0 640 512" width="1.5em" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M88.2 309.1c9.8-18.3 6.8-40.8-7.5-55.8C59.4 230.9 48 204 48 176c0-63.5 63.8-128 160-128s160 64.5 160 128s-63.8 128-160 128c-13.1 0-25.8-1.3-37.8-3.6c-10.4-2-21.2-.6-30.7 4.2c-4.1 2.1-8.3 4.1-12.6 6c-16 7.2-32.9 13.5-49.9 18c2.8-4.6 5.4-9.1 7.9-13.6c1.1-1.9 2.2-3.9 3.2-5.9zM0 176c0 41.8 17.2 80.1 45.9 110.3c-.9 1.7-1.9 3.5-2.8 5.1c-10.3 18.4-22.3 36.5-36.6 52.1c-6.6 7-8.3 17.2-4.6 25.9C5.8 378.3 14.4 384 24 384c43 0 86.5-13.3 122.7-29.7c4.8-2.2 9.6-4.5 14.2-6.8c15.1 3 30.9 4.5 47.1 4.5c114.9 0 208-78.8 208-176S322.9 0 208 0S0 78.8 0 176zM432 480c16.2 0 31.9-1.6 47.1-4.5c4.6 2.3 9.4 4.6 14.2 6.8C529.5 498.7 573 512 616 512c9.6 0 18.2-5.7 22-14.5c3.8-8.8 2-19-4.6-25.9c-14.2-15.6-26.2-33.7-36.6-52.1c-.9-1.7-1.9-3.4-2.8-5.1C622.8 384.1 640 345.8 640 304c0-94.4-87.9-171.5-198.2-175.8c4.1 15.2 6.2 31.2 6.2 47.8l0 .6c87.2 6.7 144 67.5 144 127.4c0 28-11.4 54.9-32.7 77.2c-14.3 15-17.3 37.6-7.5 55.8c1.1 2 2.2 4 3.2 5.9c2.5 4.5 5.2 9 7.9 13.6c-17-4.5-33.9-10.7-49.9-18c-4.3-1.9-8.5-3.9-12.6-6c-9.5-4.8-20.3-6.2-30.7-4.2c-12.1 2.4-24.7 3.6-37.8 3.6c-61.7 0-110-26.5-136.8-62.3c-16 5.4-32.8 9.4-50 11.8C279 439.8 350 480 432 480z" fill="var(--md-primary-bg-color)">
|
||||
</path>
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">
|
||||
Учимся вместе
|
||||
</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">
|
||||
Добро пожаловать к обсуждениям и вопросам: продвигаться вместе проще.
|
||||
</p>
|
||||
<p class="intro-quote">
|
||||
"Learning by teaching."
|
||||
<br/>
|
||||
«Обучая других, учишься сам»
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<video aria-label="Comments example" class="intro-image" data-home-poster="../assets/home/ad8bb1cc4c28091c/../shared/images/f9ac69536a7582f5/comment-poster.webp" data-home-video="../assets/home/ad8bb1cc4c28091c/../shared/media/62aa0b8d351c63a7/comment.mp4" height="1080" loop="" muted="" playsinline="" preload="none" style="aspect-ratio: 1600 / 1080" width="1600">
|
||||
</video>
|
||||
<noscript>
|
||||
<a href="../assets/home/ad8bb1cc4c28091c/../shared/media/62aa0b8d351c63a7/comment.mp4">
|
||||
<img alt="Comments example" class="intro-image" height="1080" src="../assets/home/ad8bb1cc4c28091c/../shared/images/f9ac69536a7582f5/comment-poster.webp" width="1600"/>
|
||||
Учимся вместе
|
||||
</a>
|
||||
</noscript>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="home-div" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="section-content" style="max-width: 90vw;">
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>
|
||||
Автор
|
||||
</h3>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/krahets">
|
||||
<img alt="Author: yudongjin" class="profile-img" height="512" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/02348410d40f7665/avatar_yudongjin.webp" width="512"/>
|
||||
<br/>
|
||||
<b>
|
||||
Yudong Jin (@krahets)
|
||||
</b>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>
|
||||
Переводчики
|
||||
</h3>
|
||||
<p>
|
||||
Русская печатная версия была переведена И. А. Шевкун, а русская онлайн-версия была вычитана Yuyan Huang. Благодарим их за вклад!
|
||||
</p>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell translator-profile-cell">
|
||||
<img alt="Translator: shevkun" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/91019a79d7ac4441/avatar_shevkun.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
И. А. Шевкун
|
||||
</b>
|
||||
</div>
|
||||
<div class="profile-cell translator-profile-cell">
|
||||
<a href="https://github.com/veronicahuang2977">
|
||||
<img alt="Translator: yuyanhuang" class="profile-img" height="512" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/f2c06730dacd8659/avatar_yuyanhuang.webp" width="512"/>
|
||||
<br/>
|
||||
<b>
|
||||
Yuyan Huang
|
||||
</b>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>
|
||||
Ревьюеры кода
|
||||
</h3>
|
||||
<p>
|
||||
Многоязычные версии кода в этой книге были подготовлены при участии следующих разработчиков. Благодарим их за время и вклад!
|
||||
</p>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/coderonion">
|
||||
<img alt="Reviewer: coderonion" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/db606f27971eae34/avatar_coderonion.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
coderonion
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Zig, Rust
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/curtishd">
|
||||
<img alt="Reviewer: curtishd" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/feedb0e547ea31fc/avatar_curtishd.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
curtishd
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Kotlin
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/Gonglja">
|
||||
<img alt="Reviewer: Gonglja" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/cdcf023b032b8d30/avatar_Gonglja.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
Gonglja
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
C, C++
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/gvenusleo">
|
||||
<img alt="Reviewer: gvenusleo" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/464e2d351b9263ec/avatar_gvenusleo.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
gvenusleo
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Dart
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/hpstory">
|
||||
<img alt="Reviewer: hpstory" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/7b6478acdab6b845/avatar_hpstory.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
hpstory
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
C#
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/justin-tse">
|
||||
<img alt="Reviewer: justin-tse" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/208ee5aae490eefa/avatar_justin-tse.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
justin-tse
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
JS, TS
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/khoaxuantu">
|
||||
<img alt="Reviewer: khoaxuantu" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/9d3f1a21ff51de78/avatar_khoaxuantu.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
khoaxuantu
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Ruby
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/krahets">
|
||||
<img alt="Reviewer: krahets" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/e321f9a3ac2739e0/avatar_krahets.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
krahets
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Python, Java
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/night-cruise">
|
||||
<img alt="Reviewer: night-cruise" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/960b489efa22abd4/avatar_night-cruise.jpg" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
night-cruise
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Rust
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/nuomi1">
|
||||
<img alt="Reviewer: nuomi1" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/7316a9eb4429b259/avatar_nuomi1.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
nuomi1
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Swift
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/Reanon">
|
||||
<img alt="Reviewer: Reanon" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/dcc15aa68cc793c7/avatar_Reanon.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
Reanon
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Go, C
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/rongyi">
|
||||
<img alt="Reviewer: rongyi" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/5dc6c4b1d8bfe0ac/avatar_rongyi.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
rongyi
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Rust
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>
|
||||
Участники проекта
|
||||
</h3>
|
||||
<p>
|
||||
Книга постоянно совершенствуется благодаря совместным усилиям более чем 200 участников сообщества. Спасибо им за время и вклад!
|
||||
</p>
|
||||
<a href="https://github.com/krahets/hello-algo/graphs/contributors">
|
||||
<img alt="Contributors" loading="lazy" src="https://contrib.rocks/image?repo=krahets/hello-algo&max=300&columns=12" style="width: 100%; max-width: 38.5em;"/>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<!-- This independent fallback also works when the deferred loader cannot be fetched. -->
|
||||
<script defer="" onerror="document.querySelectorAll('[data-home-src], [data-home-poster]').forEach(function(el) { if (el.dataset.homeSrc) el.src = el.dataset.homeSrc; if (el.dataset.homePoster) el.poster = el.dataset.homePoster; });" src="../assets/home/ad8bb1cc4c28091c/javascripts/homepage-media.js">
|
||||
</script>
|
||||
|
||||
@@ -1,357 +1,550 @@
|
||||
<!-- Section: hero -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div" style="height: min(100vh, 120vw); position: relative; margin-top:-2.4rem; padding: 0; overflow: hidden;">
|
||||
<!-- hero image -->
|
||||
<!-- <img alt="" class="hero-bg" src="assets/hero/universe_bg.png" /> -->
|
||||
<div class="starfield">
|
||||
<div class="starfield-origin"></div>
|
||||
</div>
|
||||
<div class="hero-div">
|
||||
<img src="../assets/hero/ground.png" alt="" style="position: absolute; width: auto; height: 26.445%; left: 28.211%; top: 54.145%;">
|
||||
<img src="../assets/hero/links.png" alt="" style="position: absolute; width: auto; height: 78.751%; left: 10.545%; top: 7.326%;">
|
||||
<a href="chapter_introduction/">
|
||||
<img src="../assets/hero/astronaut.png" alt="" style="height: 46.673%; left: 35.413%; top: 24.343%;">
|
||||
<span style="left: 52.244%; top: 20.919%;">初識演算法</span>
|
||||
</a>
|
||||
<a href="chapter_computational_complexity/">
|
||||
<img src="../assets/hero/chapter_computational_complexity.png" alt="" style="height: 12.347%; left: 36.267%; top: 37.653%;">
|
||||
<span style="left: 39.244%; top: 33.919%;">複雜度</span>
|
||||
</a>
|
||||
<a href="chapter_array_and_linkedlist/">
|
||||
<img src="../assets/hero/chapter_array_and_linkedlist.png" alt="" style="height: 22.242%; left: 73.242%; top: 52.481%;">
|
||||
<span style="left: 90.897%; top: 76.259%;">陣列與鏈結串列</span>
|
||||
</a>
|
||||
<a href="chapter_stack_and_queue/">
|
||||
<img src="../assets/hero/chapter_stack_and_queue.png" alt="" style="height: 14.302%; left: 62.646%; top: 77.875%;">
|
||||
<span style="left: 77.571%; top: 91.25%;">堆疊與佇列</span>
|
||||
</a>
|
||||
<a href="chapter_hashing/">
|
||||
<img src="../assets/hero/chapter_hashing.png" alt="" style="height: 15.266%; left: 63.281%; top: 27.933%;">
|
||||
<span style="left: 68.862%; top: 46.292%;">雜湊表</span>
|
||||
</a>
|
||||
<a href="chapter_tree/">
|
||||
<img src="../assets/hero/chapter_tree.png" alt="" style="height: 19.615%; left: 80.137%; top: 26.678%;">
|
||||
<span style="left: 96.159%; top: 44.8%;">樹</span>
|
||||
</a>
|
||||
<a href="chapter_heap/">
|
||||
<img src="../assets/hero/chapter_heap.png" alt="" style="height: 10.566%; left: 77.226%; top: 11.559%;">
|
||||
<span style="left: 88.103%; top: 15.422%;">堆積</span>
|
||||
</a>
|
||||
<a href="chapter_graph/">
|
||||
<img src="../assets/hero/chapter_graph.png" alt="" style="height: 16.112%; left: 51.854%; top: 5.575%;">
|
||||
<span style="left: 71.195%; top: 6.503%;">圖</span>
|
||||
</a>
|
||||
<a href="chapter_searching/">
|
||||
<img src="../assets/hero/chapter_searching.png" alt="" style="height: 15.149%; left: 18.185%; top: 16.404%;">
|
||||
<span style="left: 14.556%; top: 20.876%;">搜尋</span>
|
||||
</a>
|
||||
<a href="chapter_sorting/">
|
||||
<img src="../assets/hero/chapter_sorting.png" alt="" style="height: 9.574%; left: 25.409%; top: 40.747%;">
|
||||
<span style="left: 28.805%; top: 53.808%;">排序</span>
|
||||
</a>
|
||||
<a href="chapter_divide_and_conquer/">
|
||||
<img src="../assets/hero/chapter_divide_and_conquer.png" alt="" style="height: 18.681%; left: 32.721%; top: 4.816%;">
|
||||
<span style="left: 31.42%; top: 8.679%;">分治</span>
|
||||
</a>
|
||||
<a href="chapter_backtracking/">
|
||||
<img src="../assets/hero/chapter_backtracking.png" alt="" style="height: 17.338%; left: 4.875%; top: 32.925%;">
|
||||
<span style="left: 4.742%; top: 50.113%;">回溯</span>
|
||||
</a>
|
||||
<a href="chapter_dynamic_programming/">
|
||||
<img src="../assets/hero/chapter_dynamic_programming.png" alt="" style="height: 15.47%; left: 9.406%; top: 57.472%;">
|
||||
<span style="left: 8.561%; top: 75.351%;">動態規劃</span>
|
||||
</a>
|
||||
<a href="chapter_greedy/">
|
||||
<img src="../assets/hero/chapter_greedy.png" alt="" style="height: 14.127%; left: 23.132%; top: 75.803%;">
|
||||
<span style="left: 21.619%; top: 86.85%;">貪婪</span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- heading -->
|
||||
<div class="heading-div">
|
||||
<img style="height: min(9vh, 12vw);" src="https://readme-typing-svg.demolab.com/?font=Noto+Sans+SC&weight=400&duration=3500&pause=2000&color=FFF¢er=true&vCenter=true&random=false&width=200&lines=Hello%2C+%E6%BC%94%E7%AE%97%E6%B3%95+!" alt="" />
|
||||
<div style="pointer-events: auto;">
|
||||
<p style="margin-top: max(-1vh, -2vw); margin-bottom: min(2vh, 3.5vw);">
|
||||
動畫圖解、一鍵執行的資料結構與演算法教程
|
||||
</p>
|
||||
<a href="chapter_hello_algo/" class="rounded-button">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
|
||||
<path d="M160 96a96 96 0 1 1 192 0A96 96 0 1 1 160 96zm80 152V512l-48.4-24.2c-20.9-10.4-43.5-17-66.8-19.3l-96-9.6C12.5 457.2 0 443.5 0 427V224c0-17.7 14.3-32 32-32H62.3c63.6 0 125.6 19.6 177.7 56zm32 264V248c52.1-36.4 114.1-56 177.7-56H480c17.7 0 32 14.3 32 32V427c0 16.4-12.5 30.2-28.8 31.8l-96 9.6c-23.2 2.3-45.9 8.9-66.8 19.3L272 512z" />
|
||||
</svg>
|
||||
<span>開始閱讀</span>
|
||||
</a>
|
||||
<a href="https://github.com/krahets/hello-algo" class="rounded-button">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 496 512">
|
||||
<path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3 .3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5 .3-6.2 2.3zm44.2-1.7c-2.9 .7-4.9 2.6-4.6 4.9 .3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3 .7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3 .3 2.9 2.3 3.9 1.6 1 3.6 .7 4.3-.7 .7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3 .7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3 .7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z">
|
||||
</path>
|
||||
</svg>
|
||||
<span>GitHub</span>
|
||||
</a>
|
||||
</div>
|
||||
<!-- arrow -->
|
||||
<div style="text-align: center; margin-top: min(2.5vh, 3.5vw);">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="var(--md-default-fg-color)" height="2vh" viewBox="0 0 384 512">
|
||||
<path d="M169.4 470.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 370.8 224 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 306.7L54.6 265.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z" />
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Generated from the shared homepage template and locale configuration. -->
|
||||
<link href="../assets/home/ad8bb1cc4c28091c/hero-motion.css" rel="stylesheet"/>
|
||||
<noscript>
|
||||
<style>
|
||||
[data-home-src], video[data-home-poster] { display: none; }
|
||||
</style>
|
||||
</noscript>
|
||||
<section class="home-div home-universe-bg" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="starfield">
|
||||
<div class="starfield-origin">
|
||||
</div>
|
||||
</div>
|
||||
<div class="hero-div" data-home-layout="universe">
|
||||
<img alt="" data-hero-asset="ground" data-source-height="380" data-source-width="881" height="380" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/567306c070a6a7e2/ground.webp" style="position: absolute; width: auto; height: 26.445%; left: 28.211%; top: 54.145%;" width="881"/>
|
||||
<img alt="" data-hero-asset="links" data-source-height="1134" data-source-width="1562" height="1134" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/3e50f38a325c1cb5/links.webp" style="position: absolute; width: auto; height: 78.751%; left: 10.545%; top: 7.326%;" width="1562"/>
|
||||
<a href="chapter_introduction/">
|
||||
<img alt="" data-hero-asset="astronaut" data-source-height="672" data-source-width="515" height="672" src="../assets/home/ad8bb1cc4c28091c/../shared/images/8e5eb3b3e3ebd9f7/astronaut.webp" style="height: 46.673%; left: 35.413%; top: 24.343%;" width="515"/>
|
||||
<span style="left: 52.244%; top: 20.919%;">
|
||||
初識演算法
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_computational_complexity/">
|
||||
<img alt="" data-hero-asset="chapter_computational_complexity" data-source-height="178" data-source-width="113" height="178" src="../assets/home/ad8bb1cc4c28091c/../shared/images/2fb425426d1f8d86/chapter_computational_complexity.webp" style="height: 12.347%; left: 36.267%; top: 37.653%;" width="113"/>
|
||||
<span style="left: 39.244%; top: 33.919%;">
|
||||
複雜度
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_array_and_linkedlist/">
|
||||
<img alt="" data-hero-asset="chapter_array_and_linkedlist" data-source-height="319" data-source-width="468" height="319" src="../assets/home/ad8bb1cc4c28091c/../shared/images/5cbbdf7be555d3ef/chapter_array_and_linkedlist.webp" style="height: 22.242%; left: 73.242%; top: 52.481%;" width="468"/>
|
||||
<span style="left: 90.897%; top: 76.259%;">
|
||||
陣列與鏈結串列
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_stack_and_queue/">
|
||||
<img alt="" data-hero-asset="chapter_stack_and_queue" data-source-height="204" data-source-width="204" height="204" src="../assets/home/ad8bb1cc4c28091c/../shared/images/e2667767cf7481bd/chapter_stack_and_queue.webp" style="height: 14.302%; left: 62.646%; top: 77.875%;" width="204"/>
|
||||
<span style="left: 77.571%; top: 91.25%;">
|
||||
堆疊與佇列
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_hashing/">
|
||||
<img alt="" data-hero-asset="chapter_hashing" data-source-height="218" data-source-width="218" height="218" src="../assets/home/ad8bb1cc4c28091c/../shared/images/b108d70a537714cb/chapter_hashing.webp" style="height: 15.266%; left: 63.281%; top: 27.933%;" width="218"/>
|
||||
<span style="left: 68.862%; top: 46.292%;">
|
||||
雜湊表
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_tree/">
|
||||
<img alt="" data-hero-asset="chapter_tree" data-source-height="281" data-source-width="280" height="281" src="../assets/home/ad8bb1cc4c28091c/../shared/images/8138bb0acecedec4/chapter_tree.webp" style="height: 19.615%; left: 80.137%; top: 26.678%;" width="280"/>
|
||||
<span style="left: 96.159%; top: 44.8%;">
|
||||
樹
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_heap/">
|
||||
<img alt="" data-hero-asset="chapter_heap" data-source-height="152" data-source-width="151" height="152" src="../assets/home/ad8bb1cc4c28091c/../shared/images/7586281e6691807a/chapter_heap.webp" style="height: 10.566%; left: 77.226%; top: 11.559%;" width="151"/>
|
||||
<span style="left: 88.103%; top: 15.422%;">
|
||||
堆積
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_graph/">
|
||||
<img alt="" data-hero-asset="chapter_graph" data-source-height="272" data-source-width="542" height="272" src="../assets/home/ad8bb1cc4c28091c/../shared/images/175a7f2e7c3cf5f0/chapter_graph.webp" style="height: 16.112%; left: 51.854%; top: 5.575%;" width="542"/>
|
||||
<span style="left: 71.195%; top: 6.503%;">
|
||||
圖
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_searching/">
|
||||
<img alt="" data-hero-asset="chapter_searching" data-source-height="216" data-source-width="216" height="216" src="../assets/home/ad8bb1cc4c28091c/../shared/images/ebfe2b953dbb9d90/chapter_searching.webp" style="height: 15.149%; left: 18.185%; top: 16.404%;" width="216"/>
|
||||
<span style="left: 14.556%; top: 20.876%;">
|
||||
搜尋
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_sorting/">
|
||||
<img alt="" data-hero-asset="chapter_sorting" data-source-height="137" data-source-width="138" height="137" src="../assets/home/ad8bb1cc4c28091c/../shared/images/9d4be68b2680967c/chapter_sorting.webp" style="height: 9.574%; left: 25.409%; top: 40.747%;" width="138"/>
|
||||
<span style="left: 28.805%; top: 53.808%;">
|
||||
排序
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_divide_and_conquer/">
|
||||
<img alt="" data-hero-asset="chapter_divide_and_conquer" data-source-height="269" data-source-width="407" height="269" src="../assets/home/ad8bb1cc4c28091c/../shared/images/6f5766ca9385cd2e/chapter_divide_and_conquer.webp" style="height: 18.681%; left: 32.721%; top: 4.816%;" width="407"/>
|
||||
<span style="left: 31.42%; top: 8.679%;">
|
||||
分治
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_backtracking/">
|
||||
<img alt="" data-hero-asset="chapter_backtracking" data-source-height="249" data-source-width="345" height="249" src="../assets/home/ad8bb1cc4c28091c/../shared/images/176675e685febf11/chapter_backtracking.webp" style="height: 17.338%; left: 4.875%; top: 32.925%;" width="345"/>
|
||||
<span style="left: 4.742%; top: 50.113%;">
|
||||
回溯
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_dynamic_programming/">
|
||||
<img alt="" data-hero-asset="chapter_dynamic_programming" data-source-height="268" data-source-width="267" height="268" src="../assets/home/ad8bb1cc4c28091c/../shared/images/06264b1ffd05b08e/chapter_dynamic_programming.webp" style="height: 15.47%; left: 9.406%; top: 57.472%;" width="267"/>
|
||||
<span style="left: 8.561%; top: 75.351%;">
|
||||
動態規劃
|
||||
</span>
|
||||
</a>
|
||||
<a href="chapter_greedy/">
|
||||
<img alt="" data-hero-asset="chapter_greedy" data-source-height="202" data-source-width="265" height="202" src="../assets/home/ad8bb1cc4c28091c/../shared/images/2ce6caaac951c40b/chapter_greedy.webp" style="height: 14.127%; left: 23.132%; top: 75.803%;" width="265"/>
|
||||
<span style="left: 21.619%; top: 86.85%;">
|
||||
貪婪
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="heading-div">
|
||||
<img alt="" loading="lazy" src="https://readme-typing-svg.demolab.com/?font=Noto+Sans+SC&weight=400&duration=3500&pause=2000&color=FFF&center=true&vCenter=true&random=false&width=200&lines=Hello%2C+%E6%BC%94%E7%AE%97%E6%B3%95+!" style="height: min(9vh, 12vw);"/>
|
||||
<div style="pointer-events: auto;">
|
||||
<p style="margin-top: max(-1vh, -2vw); margin-bottom: min(2vh, 3.5vw);">
|
||||
動畫圖解、一鍵執行的資料結構與演算法教程
|
||||
</p>
|
||||
<a class="rounded-button" href="chapter_hello_algo/">
|
||||
<svg viewbox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
|
||||
<path d="M160 96a96 96 0 1 1 192 0A96 96 0 1 1 160 96zm80 152V512l-48.4-24.2c-20.9-10.4-43.5-17-66.8-19.3l-96-9.6C12.5 457.2 0 443.5 0 427V224c0-17.7 14.3-32 32-32H62.3c63.6 0 125.6 19.6 177.7 56zm32 264V248c52.1-36.4 114.1-56 177.7-56H480c17.7 0 32 14.3 32 32V427c0 16.4-12.5 30.2-28.8 31.8l-96 9.6c-23.2 2.3-45.9 8.9-66.8 19.3L272 512z">
|
||||
</path>
|
||||
</svg>
|
||||
<span>
|
||||
開始閱讀
|
||||
</span>
|
||||
</a>
|
||||
<a class="rounded-button" href="https://github.com/krahets/hello-algo">
|
||||
<svg viewbox="0 0 496 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3 .3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5 .3-6.2 2.3zm44.2-1.7c-2.9 .7-4.9 2.6-4.6 4.9 .3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3 .7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3 .3 2.9 2.3 3.9 1.6 1 3.6 .7 4.3-.7 .7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3 .7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3 .7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z">
|
||||
</path>
|
||||
</svg>
|
||||
<span>
|
||||
GitHub
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<div style="text-align: center; margin-top: min(2.5vh, 3.5vw);">
|
||||
<svg fill="var(--md-default-fg-color)" height="2vh" viewbox="0 0 384 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M169.4 470.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 370.8 224 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 306.7L54.6 265.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z">
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Section: reading -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content">
|
||||
<div class="reading-media">
|
||||
<!-- devices -->
|
||||
<!-- book height = 250 mm -->
|
||||
<!-- mac height = 248.1 mm -->
|
||||
<!-- ipad height = 280.6mm -->
|
||||
<!-- iphone height = 160.7mm -->
|
||||
<div class="media-block">
|
||||
<a href="/chapter_paperbook/">
|
||||
<div style="height: 8.17%;"></div>
|
||||
<img class="device-on-hover" style="height: 66.83%;" src="../assets/hero/cover_render.png" alt="Cover">
|
||||
<div class="text-button">
|
||||
<span>了解紙質書</span>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z" />
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="media-block">
|
||||
<a href="chapter_hello_algo/">
|
||||
<div style="height: 4.34%;"></div>
|
||||
<img class="device-on-hover" style="height: 66.31%;" src="../assets/hero/web_mac_iphone.png" alt="">
|
||||
<div style="height: 4.34%;"></div>
|
||||
<div class="text-button">
|
||||
<span>線上閱讀</span>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z" />
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="media-block">
|
||||
<a href="https://github.com/krahets/hello-algo/releases">
|
||||
<img class="device-on-hover" style="height: 75%;" src="../assets/hero/pdf_ipad.png" alt="">
|
||||
<div class="text-button">
|
||||
<span>下載 PDF/EPUB</span>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z" />
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<p style="margin-top: 2em;">500 幅動畫圖解、14 種程式語言程式碼、3000 條社群問答，助你快速入門資料結構與演算法</p>
|
||||
</div>
|
||||
<section class="home-div" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="section-content">
|
||||
<div class="reading-media">
|
||||
<div class="media-block">
|
||||
<a href="/chapter_paperbook/">
|
||||
<div style="height: 8.17%;">
|
||||
</div>
|
||||
<img alt="Cover" class="device-on-hover" data-home-src="../assets/home/ad8bb1cc4c28091c/../shared/images/dc5be783cea3a262/cover_render.webp" decoding="async" height="720" style="height: 66.83%;" width="535"/>
|
||||
<noscript>
|
||||
<img alt="Cover" class="device-on-hover" height="720" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/dc5be783cea3a262/cover_render.webp" style="height: 66.83%;" width="535"/>
|
||||
</noscript>
|
||||
<div class="text-button">
|
||||
<span>
|
||||
了解紙質書
|
||||
</span>
|
||||
<svg viewbox="0 0 320 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z">
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="media-block">
|
||||
<a href="chapter_hello_algo/">
|
||||
<div style="height: 4.34%;">
|
||||
</div>
|
||||
<img alt="" class="device-on-hover" data-home-src="../assets/home/ad8bb1cc4c28091c/../shared/images/5b64cf7672ec5ec6/web_mac_iphone.webp" decoding="async" height="965" style="height: 66.31%;" width="1598"/>
|
||||
<noscript>
|
||||
<img alt="" class="device-on-hover" height="965" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/5b64cf7672ec5ec6/web_mac_iphone.webp" style="height: 66.31%;" width="1598"/>
|
||||
</noscript>
|
||||
<div style="height: 4.34%;">
|
||||
</div>
|
||||
<div class="text-button">
|
||||
<span>
|
||||
線上閱讀
|
||||
</span>
|
||||
<svg viewbox="0 0 320 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z">
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="media-block">
|
||||
<a href="https://github.com/krahets/hello-algo/releases">
|
||||
<img alt="" class="device-on-hover" data-home-src="../assets/home/ad8bb1cc4c28091c/../shared/images/66baa2f9bf3abec7/pdf_ipad.webp" decoding="async" height="960" style="height: 75%;" width="812"/>
|
||||
<noscript>
|
||||
<img alt="" class="device-on-hover" height="960" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/66baa2f9bf3abec7/pdf_ipad.webp" style="height: 75%;" width="812"/>
|
||||
</noscript>
|
||||
<div class="text-button">
|
||||
<span>
|
||||
下載 PDF/EPUB
|
||||
</span>
|
||||
<svg viewbox="0 0 320 512" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M278.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L210.7 256 73.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z">
|
||||
</path>
|
||||
</svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<p style="margin-top: 2em;">
|
||||
500 幅動畫圖解、14 種程式語言程式碼、3000 條社群問答，助你快速入門資料結構與演算法
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Section: endorsements -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content">
|
||||
<h3 style="text-align: center; margin: 1em auto;">推薦語</h3>
|
||||
<div class="intro-container endor-container">
|
||||
<div class="intro-text endor-text">
|
||||
<p style="margin-bottom: 0;">“一本通俗易懂的資料結構與演算法入門書，引導讀者手腦並用地學習，強烈推薦演算法初學者閱讀。”</p>
|
||||
<p style="font-weight: bold;">—— 鄧俊輝，清華大學計算機系教授</p>
|
||||
</div>
|
||||
<div class="intro-text endor-text">
|
||||
<p style="margin-bottom: 0;">“如果我當年學資料結構與演算法的時候有《Hello 演算法》，學起來應該會簡單 10 倍！”</p>
|
||||
<p style="font-weight: bold;">—— 李沐，亞馬遜資深首席科學家</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<section class="home-div" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="section-content">
|
||||
<h3 style="text-align: center; margin: 1em auto;">
|
||||
推薦語
|
||||
</h3>
|
||||
<div class="intro-container endor-container">
|
||||
<div class="intro-text endor-text">
|
||||
<p style="margin-bottom: 0;">
|
||||
“一本通俗易懂的資料結構與演算法入門書，引導讀者手腦並用地學習，強烈推薦演算法初學者閱讀。”
|
||||
</p>
|
||||
<p style="font-weight: bold;">
|
||||
—— 鄧俊輝，清華大學計算機系教授
|
||||
</p>
|
||||
</div>
|
||||
<div class="intro-text endor-text">
|
||||
<p style="margin-bottom: 0;">
|
||||
“如果我當年學資料結構與演算法的時候有《Hello 演算法》，學起來應該會簡單 10 倍！”
|
||||
</p>
|
||||
<p style="font-weight: bold;">
|
||||
—— 李沐，亞馬遜資深首席科學家
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Section: features -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content">
|
||||
<div class="intro-container">
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="1.5em" width="1.5em" viewBox="0 0 640 512">
|
||||
<path fill="var(--md-primary-bg-color)" d="M256 0H576c35.3 0 64 28.7 64 64V288c0 35.3-28.7 64-64 64H256c-35.3 0-64-28.7-64-64V64c0-35.3 28.7-64 64-64zM476 106.7C471.5 100 464 96 456 96s-15.5 4-20 10.7l-56 84L362.7 169c-4.6-5.7-11.5-9-18.7-9s-14.2 3.3-18.7 9l-64 80c-5.8 7.2-6.9 17.1-2.9 25.4s12.4 13.6 21.6 13.6h80 48H552c8.9 0 17-4.9 21.2-12.7s3.7-17.3-1.2-24.6l-96-144zM336 96a32 32 0 1 0 -64 0 32 32 0 1 0 64 0zM64 128h96V384v32c0 17.7 14.3 32 32 32H320c17.7 0 32-14.3 32-32V384H512v64c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V192c0-35.3 28.7-64 64-64zm8 64c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V208c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V312c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H72zm336 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H424c-8.8 0-16 7.2-16 16z" />
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">動畫圖解</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">內容清晰易懂，學習曲線平滑</p>
|
||||
<p class="intro-quote">"A picture is worth a thousand words."<br>“一圖勝千言”</p>
|
||||
</div>
|
||||
</div>
|
||||
<video class="intro-image" src="index.assets/animation.mp4" autoplay loop muted playsinline aria-label="Animation example"></video>
|
||||
</div>
|
||||
|
||||
<div class="intro-container">
|
||||
<video class="intro-image" src="index.assets/running_code.mp4" autoplay loop muted playsinline aria-label="Running code example"></video>
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="1.5em" width="1.5em" viewBox="0 0 640 512">
|
||||
<path fill="var(--md-primary-bg-color)" d="M392.8 1.2c-17-4.9-34.7 5-39.6 22l-128 448c-4.9 17 5 34.7 22 39.6s34.7-5 39.6-22l128-448c4.9-17-5-34.7-22-39.6zm80.6 120.1c-12.5 12.5-12.5 32.8 0 45.3L562.7 256l-89.4 89.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l112-112c12.5-12.5 12.5-32.8 0-45.3l-112-112c-12.5-12.5-32.8-12.5-45.3 0zm-306.7 0c-12.5-12.5-32.8-12.5-45.3 0l-112 112c-12.5 12.5-12.5 32.8 0 45.3l112 112c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256l89.4-89.4c12.5-12.5 12.5-32.8 0-45.3z" />
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">一鍵執行</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">十餘種程式語言，程式碼視覺化執行</p>
|
||||
<p class="intro-quote">"Talk is cheap. Show me the code."<br>“少吹牛，看程式碼”</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="intro-container">
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="1.5em" width="1.5em" viewBox="0 0 640 512">
|
||||
<path fill="var(--md-primary-bg-color)" d="M88.2 309.1c9.8-18.3 6.8-40.8-7.5-55.8C59.4 230.9 48 204 48 176c0-63.5 63.8-128 160-128s160 64.5 160 128s-63.8 128-160 128c-13.1 0-25.8-1.3-37.8-3.6c-10.4-2-21.2-.6-30.7 4.2c-4.1 2.1-8.3 4.1-12.6 6c-16 7.2-32.9 13.5-49.9 18c2.8-4.6 5.4-9.1 7.9-13.6c1.1-1.9 2.2-3.9 3.2-5.9zM0 176c0 41.8 17.2 80.1 45.9 110.3c-.9 1.7-1.9 3.5-2.8 5.1c-10.3 18.4-22.3 36.5-36.6 52.1c-6.6 7-8.3 17.2-4.6 25.9C5.8 378.3 14.4 384 24 384c43 0 86.5-13.3 122.7-29.7c4.8-2.2 9.6-4.5 14.2-6.8c15.1 3 30.9 4.5 47.1 4.5c114.9 0 208-78.8 208-176S322.9 0 208 0S0 78.8 0 176zM432 480c16.2 0 31.9-1.6 47.1-4.5c4.6 2.3 9.4 4.6 14.2 6.8C529.5 498.7 573 512 616 512c9.6 0 18.2-5.7 22-14.5c3.8-8.8 2-19-4.6-25.9c-14.2-15.6-26.2-33.7-36.6-52.1c-.9-1.7-1.9-3.4-2.8-5.1C622.8 384.1 640 345.8 640 304c0-94.4-87.9-171.5-198.2-175.8c4.1 15.2 6.2 31.2 6.2 47.8l0 .6c87.2 6.7 144 67.5 144 127.4c0 28-11.4 54.9-32.7 77.2c-14.3 15-17.3 37.6-7.5 55.8c1.1 2 2.2 4 3.2 5.9c2.5 4.5 5.2 9 7.9 13.6c-17-4.5-33.9-10.7-49.9-18c-4.3-1.9-8.5-3.9-12.6-6c-9.5-4.8-20.3-6.2-30.7-4.2c-12.1 2.4-24.7 3.6-37.8 3.6c-61.7 0-110-26.5-136.8-62.3c-16 5.4-32.8 9.4-50 11.8C279 439.8 350 480 432 480z" />
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">互助學習</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">歡迎討論與提問，讀者間攜手共進</p>
|
||||
<p class="intro-quote">"Learning by teaching."<br>“教學相長”</p>
|
||||
</div>
|
||||
</div>
|
||||
<video class="intro-image" src="index.assets/comment.mp4" autoplay loop muted playsinline aria-label="Comments example"></video>
|
||||
</div>
|
||||
|
||||
<section class="home-div" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="section-content">
|
||||
<div class="intro-container">
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg height="1.5em" viewbox="0 0 640 512" width="1.5em" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M256 0H576c35.3 0 64 28.7 64 64V288c0 35.3-28.7 64-64 64H256c-35.3 0-64-28.7-64-64V64c0-35.3 28.7-64 64-64zM476 106.7C471.5 100 464 96 456 96s-15.5 4-20 10.7l-56 84L362.7 169c-4.6-5.7-11.5-9-18.7-9s-14.2 3.3-18.7 9l-64 80c-5.8 7.2-6.9 17.1-2.9 25.4s12.4 13.6 21.6 13.6h80 48H552c8.9 0 17-4.9 21.2-12.7s3.7-17.3-1.2-24.6l-96-144zM336 96a32 32 0 1 0 -64 0 32 32 0 1 0 64 0zM64 128h96V384v32c0 17.7 14.3 32 32 32H320c17.7 0 32-14.3 32-32V384H512v64c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V192c0-35.3 28.7-64 64-64zm8 64c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V208c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V312c0-8.8-7.2-16-16-16H72zm0 104c-8.8 0-16 7.2-16 16v16c0 8.8 7.2 16 16 16H88c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H72zm336 16v16c0 8.8 7.2 16 16 16h16c8.8 0 16-7.2 16-16V416c0-8.8-7.2-16-16-16H424c-8.8 0-16 7.2-16 16z" fill="var(--md-primary-bg-color)">
|
||||
</path>
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">
|
||||
動畫圖解
|
||||
</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">
|
||||
內容清晰易懂，學習曲線平滑
|
||||
</p>
|
||||
<p class="intro-quote">
|
||||
"A picture is worth a thousand words."
|
||||
<br/>
|
||||
“一圖勝千言”
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Section: contributors -->
|
||||
<section data-md-color-scheme="slate" data-md-color-primary="grey" class="home-div">
|
||||
<div class="section-content" style="max-width: 90vw;">
|
||||
<!-- author -->
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>作者</h3>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/krahets">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_yudongjin.jpg" alt="Author: yudongjin" />
|
||||
<br><b>靳宇棟（@krahets）</b>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- translators -->
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>譯者</h3>
|
||||
<p>本書繁體中文版由以下譯者審閱，感謝他們的貢獻！</p>
|
||||
<div class="profile-div translator-profile-div">
|
||||
<div class="profile-cell translator-profile-cell">
|
||||
<a href="https://github.com/Shyam-Chen">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_Shyam-Chen.jpg" alt="Reviewer: Shyam-Chen" />
|
||||
<br><b>Shyam-Chen</b>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell translator-profile-cell">
|
||||
<a href="https://github.com/Dr-XYZ">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_Dr-XYZ.jpg" alt="Reviewer: Dr-XYZ" />
|
||||
<br><b>Dr-XYZ</b>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- code reviewers -->
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>程式碼審閱者</h3>
|
||||
<p>本書多語言程式碼版本由以下開發者協力完成，感謝他們的投入與貢獻！</p>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/coderonion">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_coderonion.jpg" alt="Reviewer: coderonion" />
|
||||
<br><b>coderonion</b>
|
||||
<br><sub>Zig, Rust</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/curtishd">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_curtishd.jpg" alt="Reviewer: curtishd" />
|
||||
<br><b>curtishd</b>
|
||||
<br><sub>Kotlin</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/Gonglja">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_Gonglja.jpg" alt="Reviewer: Gonglja" />
|
||||
<br><b>Gonglja</b>
|
||||
<br><sub>C, C++</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/gvenusleo">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_gvenusleo.jpg" alt="Reviewer: gvenusleo" />
|
||||
<br><b>gvenusleo</b>
|
||||
<br><sub>Dart</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/hpstory">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_hpstory.jpg" alt="Reviewer: hpstory" />
|
||||
<br><b>hpstory</b>
|
||||
<br><sub>C#</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/justin-tse">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_justin-tse.jpg" alt="Reviewer: justin-tse" />
|
||||
<br><b>justin-tse</b>
|
||||
<br><sub>JS, TS</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/khoaxuantu">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_khoaxuantu.jpg" alt="Reviewer: khoaxuantu" />
|
||||
<br><b>khoaxuantu</b>
|
||||
<br><sub>Ruby</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/krahets">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_krahets.jpg" alt="Reviewer: krahets" />
|
||||
<br><b>krahets</b>
|
||||
<br><sub>Python, Java</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/night-cruise">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_night-cruise.jpg" alt="Reviewer: night-cruise" />
|
||||
<br><b>night-cruise</b>
|
||||
<br><sub>Rust</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/nuomi1">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_nuomi1.jpg" alt="Reviewer: nuomi1" />
|
||||
<br><b>nuomi1</b>
|
||||
<br><sub>Swift</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/Reanon">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_Reanon.jpg" alt="Reviewer: Reanon" />
|
||||
<br><b>Reanon</b>
|
||||
<br><sub>Go, C</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/rongyi">
|
||||
<img class="profile-img" src="../assets/avatar/avatar_rongyi.jpg" alt="Reviewer: rongyi" />
|
||||
<br><b>rongyi</b>
|
||||
<br><sub>Rust</sub>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- contributors -->
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>貢獻者</h3>
|
||||
<p>本書在開源社群 200 多位貢獻者的共同努力下不斷完善，感謝他們付出的時間與精力！</p>
|
||||
<a href="https://github.com/krahets/hello-algo/graphs/contributors">
|
||||
<img src="https://contrib.rocks/image?repo=krahets/hello-algo&max=300&columns=12" alt="Contributors" style="width: 100%; max-width: 38.5em;">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<video aria-label="Animation example" class="intro-image" data-home-poster="../assets/home/ad8bb1cc4c28091c/../shared/images/9e5f39bf33afc70f/animation-poster.webp" data-home-video="../assets/home/ad8bb1cc4c28091c/../shared/media/6c70de2b2bf4eef7/animation.mp4" height="1080" loop="" muted="" playsinline="" preload="none" style="aspect-ratio: 1600 / 1080" width="1600">
|
||||
</video>
|
||||
<noscript>
|
||||
<a href="../assets/home/ad8bb1cc4c28091c/../shared/media/6c70de2b2bf4eef7/animation.mp4">
|
||||
<img alt="Animation example" class="intro-image" height="1080" src="../assets/home/ad8bb1cc4c28091c/../shared/images/9e5f39bf33afc70f/animation-poster.webp" width="1600"/>
|
||||
動畫圖解
|
||||
</a>
|
||||
</noscript>
|
||||
</div>
|
||||
<div class="intro-container">
|
||||
<video aria-label="Running code example" class="intro-image" data-home-poster="../assets/home/ad8bb1cc4c28091c/../shared/images/f33a13e8331245ae/running_code-poster.webp" data-home-video="../assets/home/ad8bb1cc4c28091c/../shared/media/bb169a96ca8316da/running_code.mp4" height="1082" loop="" muted="" playsinline="" preload="none" style="aspect-ratio: 1600 / 1082" width="1600">
|
||||
</video>
|
||||
<noscript>
|
||||
<a href="../assets/home/ad8bb1cc4c28091c/../shared/media/bb169a96ca8316da/running_code.mp4">
|
||||
<img alt="Running code example" class="intro-image" height="1082" src="../assets/home/ad8bb1cc4c28091c/../shared/images/f33a13e8331245ae/running_code-poster.webp" width="1600"/>
|
||||
一鍵執行
|
||||
</a>
|
||||
</noscript>
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg height="1.5em" viewbox="0 0 640 512" width="1.5em" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M392.8 1.2c-17-4.9-34.7 5-39.6 22l-128 448c-4.9 17 5 34.7 22 39.6s34.7-5 39.6-22l128-448c4.9-17-5-34.7-22-39.6zm80.6 120.1c-12.5 12.5-12.5 32.8 0 45.3L562.7 256l-89.4 89.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l112-112c12.5-12.5 12.5-32.8 0-45.3l-112-112c-12.5-12.5-32.8-12.5-45.3 0zm-306.7 0c-12.5-12.5-32.8-12.5-45.3 0l-112 112c-12.5 12.5-12.5 32.8 0 45.3l112 112c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256l89.4-89.4c12.5-12.5 12.5-32.8 0-45.3z" fill="var(--md-primary-bg-color)">
|
||||
</path>
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">
|
||||
一鍵執行
|
||||
</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">
|
||||
十餘種程式語言，程式碼視覺化執行
|
||||
</p>
|
||||
<p class="intro-quote">
|
||||
"Talk is cheap. Show me the code."
|
||||
<br/>
|
||||
“少吹牛，看程式碼”
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="intro-container">
|
||||
<div class="intro-text">
|
||||
<div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<svg height="1.5em" viewbox="0 0 640 512" width="1.5em" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M88.2 309.1c9.8-18.3 6.8-40.8-7.5-55.8C59.4 230.9 48 204 48 176c0-63.5 63.8-128 160-128s160 64.5 160 128s-63.8 128-160 128c-13.1 0-25.8-1.3-37.8-3.6c-10.4-2-21.2-.6-30.7 4.2c-4.1 2.1-8.3 4.1-12.6 6c-16 7.2-32.9 13.5-49.9 18c2.8-4.6 5.4-9.1 7.9-13.6c1.1-1.9 2.2-3.9 3.2-5.9zM0 176c0 41.8 17.2 80.1 45.9 110.3c-.9 1.7-1.9 3.5-2.8 5.1c-10.3 18.4-22.3 36.5-36.6 52.1c-6.6 7-8.3 17.2-4.6 25.9C5.8 378.3 14.4 384 24 384c43 0 86.5-13.3 122.7-29.7c4.8-2.2 9.6-4.5 14.2-6.8c15.1 3 30.9 4.5 47.1 4.5c114.9 0 208-78.8 208-176S322.9 0 208 0S0 78.8 0 176zM432 480c16.2 0 31.9-1.6 47.1-4.5c4.6 2.3 9.4 4.6 14.2 6.8C529.5 498.7 573 512 616 512c9.6 0 18.2-5.7 22-14.5c3.8-8.8 2-19-4.6-25.9c-14.2-15.6-26.2-33.7-36.6-52.1c-.9-1.7-1.9-3.4-2.8-5.1C622.8 384.1 640 345.8 640 304c0-94.4-87.9-171.5-198.2-175.8c4.1 15.2 6.2 31.2 6.2 47.8l0 .6c87.2 6.7 144 67.5 144 127.4c0 28-11.4 54.9-32.7 77.2c-14.3 15-17.3 37.6-7.5 55.8c1.1 2 2.2 4 3.2 5.9c2.5 4.5 5.2 9 7.9 13.6c-17-4.5-33.9-10.7-49.9-18c-4.3-1.9-8.5-3.9-12.6-6c-9.5-4.8-20.3-6.2-30.7-4.2c-12.1 2.4-24.7 3.6-37.8 3.6c-61.7 0-110-26.5-136.8-62.3c-16 5.4-32.8 9.4-50 11.8C279 439.8 350 480 432 480z" fill="var(--md-primary-bg-color)">
|
||||
</path>
|
||||
</svg>
|
||||
<h3 style="margin-left: 0.5em;">
|
||||
互助學習
|
||||
</h3>
|
||||
</div>
|
||||
<p style="margin: 0;">
|
||||
歡迎討論與提問，讀者間攜手共進
|
||||
</p>
|
||||
<p class="intro-quote">
|
||||
"Learning by teaching."
|
||||
<br/>
|
||||
“教學相長”
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<video aria-label="Comments example" class="intro-image" data-home-poster="../assets/home/ad8bb1cc4c28091c/../shared/images/f9ac69536a7582f5/comment-poster.webp" data-home-video="../assets/home/ad8bb1cc4c28091c/../shared/media/62aa0b8d351c63a7/comment.mp4" height="1080" loop="" muted="" playsinline="" preload="none" style="aspect-ratio: 1600 / 1080" width="1600">
|
||||
</video>
|
||||
<noscript>
|
||||
<a href="../assets/home/ad8bb1cc4c28091c/../shared/media/62aa0b8d351c63a7/comment.mp4">
|
||||
<img alt="Comments example" class="intro-image" height="1080" src="../assets/home/ad8bb1cc4c28091c/../shared/images/f9ac69536a7582f5/comment-poster.webp" width="1600"/>
|
||||
互助學習
|
||||
</a>
|
||||
</noscript>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="home-div" data-md-color-primary="grey" data-md-color-scheme="slate">
|
||||
<div class="section-content" style="max-width: 90vw;">
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>
|
||||
作者
|
||||
</h3>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/krahets">
|
||||
<img alt="Author: yudongjin" class="profile-img" height="512" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/02348410d40f7665/avatar_yudongjin.webp" width="512"/>
|
||||
<br/>
|
||||
<b>
|
||||
靳宇棟（@krahets）
|
||||
</b>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>
|
||||
譯者
|
||||
</h3>
|
||||
<p>
|
||||
本書繁體中文版由以下譯者審閱，感謝他們的貢獻！
|
||||
</p>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell translator-profile-cell">
|
||||
<a href="https://github.com/Shyam-Chen">
|
||||
<img alt="Reviewer: Shyam-Chen" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/a635319ad4eaf2e9/avatar_Shyam-Chen.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
Shyam-Chen
|
||||
</b>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell translator-profile-cell">
|
||||
<a href="https://github.com/Dr-XYZ">
|
||||
<img alt="Reviewer: Dr-XYZ" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/b5b4c188d159778c/avatar_Dr-XYZ.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
Dr-XYZ
|
||||
</b>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>
|
||||
程式碼審閱者
|
||||
</h3>
|
||||
<p>
|
||||
本書多語言程式碼版本由以下開發者協力完成，感謝他們的投入與貢獻！
|
||||
</p>
|
||||
<div class="profile-div">
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/coderonion">
|
||||
<img alt="Reviewer: coderonion" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/db606f27971eae34/avatar_coderonion.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
coderonion
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Zig, Rust
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/curtishd">
|
||||
<img alt="Reviewer: curtishd" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/feedb0e547ea31fc/avatar_curtishd.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
curtishd
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Kotlin
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/Gonglja">
|
||||
<img alt="Reviewer: Gonglja" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/cdcf023b032b8d30/avatar_Gonglja.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
Gonglja
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
C, C++
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/gvenusleo">
|
||||
<img alt="Reviewer: gvenusleo" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/464e2d351b9263ec/avatar_gvenusleo.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
gvenusleo
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Dart
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/hpstory">
|
||||
<img alt="Reviewer: hpstory" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/7b6478acdab6b845/avatar_hpstory.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
hpstory
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
C#
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/justin-tse">
|
||||
<img alt="Reviewer: justin-tse" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/208ee5aae490eefa/avatar_justin-tse.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
justin-tse
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
JS, TS
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/khoaxuantu">
|
||||
<img alt="Reviewer: khoaxuantu" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/9d3f1a21ff51de78/avatar_khoaxuantu.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
khoaxuantu
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Ruby
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/krahets">
|
||||
<img alt="Reviewer: krahets" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/e321f9a3ac2739e0/avatar_krahets.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
krahets
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Python, Java
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/night-cruise">
|
||||
<img alt="Reviewer: night-cruise" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/960b489efa22abd4/avatar_night-cruise.jpg" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
night-cruise
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Rust
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/nuomi1">
|
||||
<img alt="Reviewer: nuomi1" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/7316a9eb4429b259/avatar_nuomi1.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
nuomi1
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Swift
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/Reanon">
|
||||
<img alt="Reviewer: Reanon" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/dcc15aa68cc793c7/avatar_Reanon.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
Reanon
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Go, C
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
<div class="profile-cell">
|
||||
<a href="https://github.com/rongyi">
|
||||
<img alt="Reviewer: rongyi" class="profile-img" height="384" loading="lazy" src="../assets/home/ad8bb1cc4c28091c/../shared/images/5dc6c4b1d8bfe0ac/avatar_rongyi.webp" width="384"/>
|
||||
<br/>
|
||||
<b>
|
||||
rongyi
|
||||
</b>
|
||||
<br/>
|
||||
<sub>
|
||||
Rust
|
||||
</sub>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin: 2em auto;">
|
||||
<h3>
|
||||
貢獻者
|
||||
</h3>
|
||||
<p>
|
||||
本書在開源社群 200 多位貢獻者的共同努力下不斷完善，感謝他們付出的時間與精力！
|
||||
</p>
|
||||
<a href="https://github.com/krahets/hello-algo/graphs/contributors">
|
||||
<img alt="Contributors" loading="lazy" src="https://contrib.rocks/image?repo=krahets/hello-algo&max=300&columns=12" style="width: 100%; max-width: 38.5em;"/>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<!-- This independent fallback also works when the deferred loader cannot be fetched. -->
|
||||
<script defer="" onerror="document.querySelectorAll('[data-home-src], [data-home-poster]').forEach(function(el) { if (el.dataset.homeSrc) el.src = el.dataset.homeSrc; if (el.dataset.homePoster) el.poster = el.dataset.homePoster; });" src="../assets/home/ad8bb1cc4c28091c/javascripts/homepage-media.js">
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user