2b:null 2c:["$","title",null,{"children":"Learning Observable: Observable overview | Ssen Kim | Observable"}] 31:T6fd,### Data analysis and visualization JavaScript has been a common language for data visualization for many years. [D3](https://d3js.org/) has become the de facto framework for bespoke data visualization, used extensively by news organizations and for custom visualization applications. Many other great visualization frameworks are also built in JavaScript, such as [VegaLite](https://vega.github.io/vega-lite/), [Highcharts](https://www.highcharts.com/), [Observable Plot](https://observablehq.com/plot), and more. JavaScript is clearly the language of choice for data visualization today. __Observable에서 우리는 "데이터 시각화가 데이터 분석"이라고 믿습니다. 차트를 사용하면 수학적 모델이 아닌 시각적 인코딩을 사용하여 데이터의 패턴을 탐색하고 이해할 수 있습니다. 통찰력을 드러내고 모델 가정 및 수치 출력 내에 숨겨져 있을 수 있는 질문을 제기할 수 있습니다. 또한 시각적 개체는 모델에 익숙하지 않거나 모델을 해석하는 방법을 모르는 이해 관계자와 통찰력을 전달하는 보다 접근하기 쉽고 매력적인 방법이 될 수 있습니다.__ With tools to aggregate and summarize raw data directly in visualizations (for example, see [Plot group](https://observablehq.com/@observablehq/plot-group) for grouped transformations right in Observable Plot), Observable makes it straightforward to view patterns in raw and transformed data without the need for extensive data preparation. Combined with SQL cells and JavaScript libraries for data wrangling and analysis (which are easily loaded into notebooks using [require](https://observablehq.com/@observablehq/require)), Observable has the tools you need for many data analysis essentials.32:T428,### Community support and engagement In addition to providing inspiration and reusable code, the Observable Community provides invaluable support while you learn and work. Here are several places to reach out for help, clarification and support: - [Observable Community Forum](https://talk.observablehq.com/) - [Observable Community Slack Workspace](https://join.slack.com/t/observable-community/shared_invite/zt-1icwex7uf-ovIAS0PcuJ~ZgBToSyUs8w) To stay up-to-date on new features, community highlights, and events, we also recommend: - Signing-up to receive the monthly [Observable Newsletter](https://observablehq.com/@observablehq/community-newsletter-signup) - Subscribing to the [Observable Blog](https://observablehq.com/@observablehq/blog-subscribe) - Bookmarking the [Observable Release Notes](https://observablehq.com/@observablehq/release-notes) - Following Observable on [Twitter](https://twitter.com/observablehq), [Mastodon](https://mastodon.social/@observablehq@vis.social), and [LinkedIn](https://www.linkedin.com/company/observable/mycompany/)33:[{"id":"76408ac762f2c821dfeeda57b59f044cb3844bf9a1556240a60c1f0ebcb6f4c87d774e4109c3bc198ac1c76118757cd7bbe3dc427b1001423b6592d32968fbdb","href":"https://static.observableusercontent.com/files/76408ac762f2c821dfeeda57b59f044cb3844bf9a1556240a60c1f0ebcb6f4c87d774e4109c3bc198ac1c76118757cd7bbe3dc427b1001423b6592d32968fbdb","name":"reuseViz.mov","type":"video/quicktime","lastModified":1674748727347.143,"size":14432073},{"id":"d9e7ac8a7d87eae5c097521fe33eb471c4a989657663f168a710fde5d44ac146517c2b2827a3ccf0fe7f669de91457ba18bf3ab7ba88628bf71f2724aa51f56d","href":"https://static.observableusercontent.com/files/d9e7ac8a7d87eae5c097521fe33eb471c4a989657663f168a710fde5d44ac146517c2b2827a3ccf0fe7f669de91457ba18bf3ab7ba88628bf71f2724aa51f56d","name":"import.mov","type":"video/quicktime","lastModified":1674748727347.143,"size":1573572},{"id":"a052dca96a4691cb44670d5622f10829f94e973fadc3a4ec7725b16e9c6574c5ccb4186e405e402e55f509cb0676e340e91c9f02096f72e3f284c23887107ea7","href":"https://static.observableusercontent.com/files/a052dca96a4691cb44670d5622f10829f94e973fadc3a4ec7725b16e9c6574c5ccb4186e405e402e55f509cb0676e340e91c9f02096f72e3f284c23887107ea7","name":"cellMenuExample.mov","type":"video/quicktime","lastModified":1674748727347.143,"size":2534645},{"id":"7ea2943b33f42e3ba8a9b0b6fa305a4b7402fc0e7c3602825df5c782c52b414ab8094e42d9c79931e767069935076f35a3731dded51b9124cab8fe2ad48e300f","href":"https://static.observableusercontent.com/files/7ea2943b33f42e3ba8a9b0b6fa305a4b7402fc0e7c3602825df5c782c52b414ab8094e42d9c79931e767069935076f35a3731dded51b9124cab8fe2ad48e300f","name":"cells.jpg","type":"image/jpeg","lastModified":1674748727347.143,"size":285410},{"id":"d035e4ea4250e62490da0c67afa10ba0e82f557c22517d6902ffe8919691b9b67f3893af6409d1caa0ea6b6407de0ec63fe365c19b43c7f4702ad88f3b2b0bd9","href":"https://static.observableusercontent.com/files/d035e4ea4250e62490da0c67afa10ba0e82f557c22517d6902ffe8919691b9b67f3893af6409d1caa0ea6b6407de0ec63fe365c19b43c7f4702ad88f3b2b0bd9","name":"Data_Jam.png","type":"image/png","lastModified":1674748727347.143,"size":101561},{"id":"8b10ec996ff1011f09bb7afa7c6165d2564de7aa457530c8e163ae41557cae2808f5430412b10abf3315cc82223d094b71b064fd863a69d3197401e5a6f4ecf6","href":"https://static.observableusercontent.com/files/8b10ec996ff1011f09bb7afa7c6165d2564de7aa457530c8e163ae41557cae2808f5430412b10abf3315cc82223d094b71b064fd863a69d3197401e5a6f4ecf6","name":"inputs2.mov","type":"video/quicktime","lastModified":1674748727347.143,"size":8822289},{"id":"9c17031dda3bd7f0dcbf1563224296ead814080c65f23907afbdef78bfe558841076358d1f130dec0c60d8cc02cd845b452569e1b41ea1f61647310f509f0cb9","href":"https://static.observableusercontent.com/files/9c17031dda3bd7f0dcbf1563224296ead814080c65f23907afbdef78bfe558841076358d1f130dec0c60d8cc02cd845b452569e1b41ea1f61647310f509f0cb9","name":"files.mov","type":"video/quicktime","lastModified":1674748727347.143,"size":1619039},{"id":"aa6ff924f4e6e34bdc8e8cd3ba1b1b4c2e85c470d9fd409feb2994b7e49732126b241fc2969b44be3d77156d4e12db6e44d5e45a4b2ff3fb2aa3706c1c49c465","href":"https://static.observableusercontent.com/files/aa6ff924f4e6e34bdc8e8cd3ba1b1b4c2e85c470d9fd409feb2994b7e49732126b241fc2969b44be3d77156d4e12db6e44d5e45a4b2ff3fb2aa3706c1c49c465","name":"history@1.mov","type":"video/quicktime","lastModified":1674748727347.143,"size":3482805},{"id":"50445938ecd8ba13036f43905c744c949ed6c7ba129fdbde400f97774c86640c88e72ca0665c75a357825fa8c77a07905af9b07ecbe28b642b4b27986d2b8746","href":"https://static.observableusercontent.com/files/50445938ecd8ba13036f43905c744c949ed6c7ba129fdbde400f97774c86640c88e72ca0665c75a357825fa8c77a07905af9b07ecbe28b642b4b27986d2b8746","name":"comments.mov","type":"video/quicktime","lastModified":1674748727347.143,"size":4619399},{"id":"306c93b6bdb095e0a53ad4166977f7c84b5cc3b11f070caf99a97da48325f57a8c52189664c1ceb06458f2ab60e715a7175f0c1b12826d3643c6d7e96603c958","href":"https://static.observableusercontent.com/files/306c93b6bdb095e0a53ad4166977f7c84b5cc3b11f070caf99a97da48325f57a8c52189664c1ceb06458f2ab60e715a7175f0c1b12826d3643c6d7e96603c958","name":"collab.mov","type":"video/quicktime","lastModified":1674748727347.143,"size":5774538},{"id":"6e65443fc2da094e1cfa2a1c21f941711025e58eb5393b9a71fe3fd7764a07db8fe35e4c9274032d467c166063f24cba1612d41d44d56fdd573fd9c2382288bf","href":"https://static.observableusercontent.com/files/6e65443fc2da094e1cfa2a1c21f941711025e58eb5393b9a71fe3fd7764a07db8fe35e4c9274032d467c166063f24cba1612d41d44d56fdd573fd9c2382288bf","name":"new-users-course-sm-overview@1.png","type":"image/png","lastModified":1674748727347.143,"size":1055174}] 2f:{"id":"3e82d2c5237d65cb","slug":null,"title":"Learning Observable: Observable overview","thumbnail":"1890527d262f64234d78b2399fe4b8dae16d8390d75cb7e0f6025fea0563ad7d","access_level":"public","create_time":"$D2023-01-26T15:58:47.347Z","update_time":"$D2023-01-26T16:17:24.918Z","view_time":null,"first_public_time":"$D2023-01-26T15:58:47.347Z","has_unpublished_edits":null,"fork":true,"stars":1,"starred":false,"owner":{"type":"team","id":"ca32d02dd4fd9da1","login":"ssen0117","name":"Ssen Kim","avatar_url":"https://avatars-next.observableusercontent.com/acfa6bf30847029913fca8c84b4fea2653ded376d0d91ef7944bb954a0c4fbef","tier":"starter_2024"},"version":588,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"388e6ba669af2a7d","login":"ssen0117","name":"Ssen Kim","avatar_url":"https://avatars-next.observableusercontent.com/acfa6bf30847029913fca8c84b4fea2653ded376d0d91ef7944bb954a0c4fbef","tier":null}],"members":[{"type":"individual","id":"388e6ba669af2a7d","login":"ssen0117","name":"Ssen Kim","avatar_url":"https://avatars-next.observableusercontent.com/acfa6bf30847029913fca8c84b4fea2653ded376d0d91ef7944bb954a0c4fbef","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Learning Observable: Observable overview","cells":[{"id":0,"value":"# Learning Observable: Observable overview","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":420,"value":"

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":31,"value":"Observable은 데이터에서 인사이트로 가는 경로를 간소화합니다. — for both individuals and teams. In Observable notebooks, users can quickly access their data and combine text, analyses, and data visualizations in the same place. Collections of code snippets and low-code features allow anyone to quickly build or modify notebooks. Observable is built for collaboration and sharing, so that more people can explore, work with, and contribute to discussions around data.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":295,"value":"## The Notebook\n\nWhat you are reading now — this page or document — is an Observable notebook. Observable notebooks are __interactive, editable documents defined by code__. ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":45,"value":"노트북의 모든 콘텐츠는 셀에서 만들어집니다. 셀 내에서 형식이 지정된 텍스트(markdown) 및 코드(JavaScript, SQL, HTML)를 작성하여 사용자 정의된 데이터 테이블 및 시각화와 함께 바로 볼 수 있습니다. 그런 다음 팀원 및 이해 관계자와 작업을 신속하게 공유하여 모든 사람이 말 그대로 같은 페이지에 있도록 합니다.\n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":282,"value":"

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":279,"value":"노트북은 프리젠테이션을 위한 최종 제품인 동시에 데이터 분석, 탐색 및 창의적인 수정을 위한 빈 캔버스입니다. 소프트웨어 설치나 환경 설정이 필요하지 않기 때문에 Observable 노트북을 시작하고 실행하는 장벽은 코더와 코더가 아닌 사람 모두에게 낮습니다.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":211,"value":"---\n\n## Upload data, visualize and add interactivity in minutes\n\nObservable에서 우리는 데이터, 코드 작성 또는 시각화 구축에 대한 이전 경험에 관계없이 모든 사람이 최소한의 마찰로 데이터에서 통찰력을 얻을 수 있도록 돕는 것을 목표로 합니다. Observable 노트북에는 로우 코드 데이터 액세스, 분석 및 시각화를 위한 풍부한 기능과 코드 스니펫이 여러분의 손끝에 존재합니다.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":237,"value":"#### Upload data\n\nIn Observable, you can quickly access your own data by attaching local files or spreadsheets, connecting to [APIs](https://observablehq.com/@observablehq/working-with-apis-remote-files?collection=@observablehq/working-with-data), and — for Enterprise and Pro users —, connecting to [databases](https://observablehq.com/@observablehq/databases) or [cloud files](https://observablehq.com/@observablehq/cloud-files). Here is an example of uploading a CSV file to an Observable notebook, and viewing its contents in a data table. ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":476,"value":"

","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":61,"value":"#### Visualize data with Plot\n\nThe [Observable Plot](https://observablehq.com/@observablehq/plot) library lets you quickly build and customize data visualizations. Code snippets are provided in the [cell menu](https://observablehq.com/@observablehq/adding-cells?collection=@observablehq/notebook-fundamentals) as a starting point for many common chart types. They help get you up and running quickly with your own visualizations by simply substituting your data and variable names.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":447,"value":"

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":343,"value":"#### Add interactivity\n\n[Observable Inputs](https://observablehq.com/@observablehq/inputs) are lightweight interface components (including buttons, sliders, dropdowns, tables, and text inputs) that help you explore data and build interactive displays. You can also find them in the cell menu.\n\n노트북에 입력을 추가한 후 해당 값을 차트의 하나 이상의 요소에 연결하여 상호 작용을 추가하십시오. Observable 노트북은 _웹에 있고 웹 언어로 되어 있기 때문에_ 대화형 차트를 공동 작업자와 즉시 공유할 수 있습니다.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":449,"value":"

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":65,"value":"\n## Made for collaboration\nAt Observable, we believe that collaboration is key to doing responsible, innovative work with data. That's why we support several ways to collaborate with others in notebooks, whether it's co-editing a visualization or adding comments to an analysis. Here are a few ways that Observable is built with collaboration in mind.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":94,"value":"#### Multiplayer editing\nYou can invite others to join and edit notebooks with you. Edits are live and visible to all users who are present at the same time. You can see other active users' avatars at the top of the screen. Click on them to automatically follow them around the notebook!","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":95,"value":"

\n","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":103,"value":"#### Explore, comment and discuss — right in the notebook\n\nCollaborators and stakeholders don't require edit access to contribute to work in an Observable notebook. Anyone with view access can interact with notebooks using [inputs](https://observablehq.com/d/a6eb5a18f8943489?collection=@observablehq/enterprise-training-curriculum#cell-22), and can give feedback and participate in discussions using [comments](https://observablehq.com/@observablehq/comments). Comments get sent to the original editor so they can respond and resolve. ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":107,"value":"

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":98,"value":"#### Version history\nWhether working solo or with collaborators in a notebook, it is useful to have a record of changes made. The [History](https://observablehq.com/@observablehq/history) pane (accessed by clicking the clock icon in the right margin) shows what changes were made to your notebook. You can also revert back to earlier versions at any time. \n\nAutomated version history in Observable means that everyone working in the notebook can safely make edits and investigate changes.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":99,"value":"

","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":142,"value":"## JavaScript for data analysis\n\nObservable에서는 JavaScript가 데이터 분석의 미래라고 믿습니다. 공동 설립자 Mike Bostock은 다음과 같이 썼습니다. [Towards Data Science](https://towardsdatascience.com/javascript-for-data-analysis-2e8e7dbf63a7):\n> _JavaScript는 커뮤니케이션을 위해 우리가 가진 가장 풍부한 매체이지만\n> 웹의 개방성 덕분에 검사하고 수정하기 쉽고 학습과 협업을 위한 매체이기도 합니다._\n\nJavaScript에는 R, Python 또는 Julia에서 볼 수 있는 광범위한 데이터 분석 및 데이터 과학 라이브러리가 부족하지만 이식성과 편의성으로 이를 보완합니다. 읽고 있는 이 노트북은 노트북, 태블릿 또는 휴대폰의 브라우저에서 실행되고 있습니다. 코드를 보고, 코드를 편집하고, 해당 장치에서 코드를 실행할 수 있습니다. 설정이 필요하지 않으며 설치할 소프트웨어가 없습니다. _간단하게_ 작동합니다.\n\n많은 워크플로우가 웹으로 이동함에 따라 더 불편해지지 않는 워크플로우입니다. 우리에게 필요한 것은 데이터 분석을 위한 JavaScript의 더 나은 도구이며 Observable이 필요한 곳입니다.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":197,"value":"$31","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":407,"value":"## The Observable Community\n\nThe community of Observable creators, learners, readers, and ambassadors is vast. By joining the [Observable community](https://observablehq.com/community), you tap into a universe of published notebooks and examples that you can look to for inspiration and reuse in your own work. You also get direct support from community members when you have questions or need help.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":8,"value":"### Community contributions for inspiration and reuse \n\nThe Observable community is home to thousands of visualization and data analysis examples. Our [explore](https://observablehq.com/explore) page is your portal to our top content, rated by community likes and curated by the Observable team. Examples you find can be reused for your own analysis, either by importing the code itself or forking the notebook to your own workspace. \n","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":9,"value":"Visualization code is easy to reuse for other datasets. The [D3 Charts](https://observablehq.com/collection/@d3/charts) collection features dozens of reusable functions that you can easily import into your own notebooks to analyze your own data.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":10,"value":"

\n","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":11,"value":"The video above shows an example of an [import](https://observablehq.com/@observablehq/import?collection=@observablehq/notebook-fundamentals). Observable lets you quickly reuse content by importing named cells from other notebooks. Most often you'll import code and functions for reuse, but imports are versatile — you can also import charts, inputs, tables, text, or even data. This works with community notebooks, as well as private notebooks within a team.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":12,"value":"

\n","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":14,"value":"With content from thousands of community-contributed Observable notebooks available for reuse, how can you focus your search to find what you need? Check out our guide for [searching on Observable](https://observablehq.com/@observablehq/searching-on-observable) and visit a couple of our favorite links:\n- Community examples\n - [Trending notebooks](https://observablehq.com/trending)\n - [Most liked (all time) notebooks](https://observablehq.com/top)\n- Visualization examples from the Observable team\n - [Plot examples](https://observablehq.com/collection/@observablehq/plot-examples)\n - [D3 charts](https://observablehq.com/collection/@d3/charts)\n - [Maps](https://observablehq.com/collection/@observablehq/maps)","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":411,"value":"$32","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":527,"value":"newUsersCourseSmOverview1 = FileAttachment(\"new-users-course-sm-overview@1.png\").image({width: 200})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W33","stdlib":"1","titling":"auto"}} 30:"$2f:body"