Apache ZooKeeper is an effort to develop and maintain an open-source server which enables highly reliable distributed coordination.

무슨말인지 말 모르겠다. 분산처리와 관련되어 사용되는 것 같은데.. 아직 분산처리를 실행해본적이 없어서 경험과 연결되지 않아서 더 난해하다.

Zookeeper it self is allowing multiple clients to perform simultaneous reads and writes and acts as a shared configuration service within the system.

여러 클라이언트들이 동시에 데이터에 접근할 수 있도록 도와주는 시스템인 것 같다.

복수의 서버들이 대규모 클라이언트들의 데이터 요청을 처리해주는 서버로 이해가 된다. 이때 데이터의 일관성을 유지하고, 업데이트를 진행하는 방식이 궁금하기는 한데 일단은 이정도로만 이해하고 디테일은 나중에 필요할 때 찾아보면 될 것 같다.

2. Vitess

Vitess is a database solution for deploying, scaling and managing large clusters of open-source database instances. It currently supports MySQL and Percona Server for MySQL. It's architected to run as effectively in a public or private cloud architecture as it does on dedicated hardware. It combines and extends many important SQL features with the scalability of a NoSQL database.

데이터베이스를 배포하고 확장해주는 역할?

내가 제대로 이해하고있는 건지는 모르겠지만 아키텍쳐 이미지를 보면 그게 어떤 역할을 하는지가 더 잘 이해되는 것 같다. Zookeeper가 대규모 서버접근 요청을 분산적으로 처리해주는 역할을 맡는다면 Vitess는 데이터베이스 접근 요청을 분산적으로 처리해주는 역할을 맡는 듯 하다

3. TimeScaleDB

TimescaleDB is the open-source relational database for time-series and analytics. Build powerful data-intensive applications.

RDB라는건 알겠는데, time-series라는 특징이 어떤점에서 기존 일반적인 DB와 차이점을 만드는걸까?

TimescaleDB offers three key benefits over vanilla PostgreSQL or other traditional RDBMSs for storing time-series data:

1. Much higher data ingest rates, especially at larger database sizes.

2. Query performance ranging from equivalent to orders of magnitude greater.

3. Time-oriented features.

And because TimescaleDB still allows you to use the full range of PostgreSQL features and tools — for example, JOINs with relational tables, geospatial queries via PostGIS, pg_dump and pg_restore, any connector that speaks PostgreSQL — there is little reason not to use TimescaleDB for storing time-series data within a PostgreSQL node.

기존 디비 API를 그대로 활용할 수 있으면서 대규모 시계열 데이터 처리에 유리해서. 음 이런거를 도입할 정도면은 정말 대규모 데이터를 처리해야 해서 자그마한 차이가 엄청난 효과를 줄때 도입을 고려할만 하겠다. 사실 보통의 서비스는 일단 가장 일반적인 프로그램을 활용해서 개발하는게 맞는거 같음.

A Flutter Charts library which includes the data visualization widgets such as cartesian and circular charts, to create real-time, interactive, high-performance, animated charts.

그래프를 그릴 수 있다.

2. just_audio

A feature-rich audio player for Flutter. Loop, clip and concatenate any sound from any source (asset/file/URL/stream) in a variety of audio formats with gapless playback.

오디오 플레이어를 사용할 수 있다.

3. animated_text_kit

A flutter package project which contains a collection of cool and beautiful text animations

텍스트 애니메이션을 적용할 수 있다.

4. sign_in_with_apple

Flutter bridge to initiate Sign in with Apple (on iOS, macOS, and Android). Includes support for keychain entries as well as signing in with an Apple ID.

애플로그인을 사용할 수 있다.

5. flutter_easyloading

A clean and lightweight loading/toast widget for Flutter, Easy to use without context, Support iOS、Android and Web

로더 애니메이션을 사용할 수 있다.

6. expandable

A Flutter widget that can be expanded or collapsed by clicking on a header or an icon.

익스펜더블 위젯을 사용할 수 있다.

7. wakelock

Plugin that allows you to keep the device screen awake, i.e. prevent the screen from sleeping on Android, iOS, macOS, Windows, and web.

디바이스 스크린을 계속 활성화되게 유지할 수 있다.

8. chewie

A video player for Flutter with Cupertino and Material play controls

비디오 플레이어를 사용할 수 있다.

9. sliding_up_panel

A draggable Flutter widget that makes implementing a SlidingUpPanel much easier!

패널을 드래그 할 수 있다.

10. dropdown_search

Simple and robust Searchable Dropdown with item search feature, making it possible to use an offline item list or filtering URL for easy customization.

검색 자동완성 드랍다운을 사용할 수 있다.

11. connectivity_plus

Flutter plugin for discovering the state of the network (WiFi & mobile/cellular) connectivity on Android and iOS.

네트워크 접근상태 데이터를 활용할 수 있다.

12. uuid

RFC4122 (v1, v4, v5) UUID Generator and Parser for all Dart platforms (Web, VM, Flutter)

uuid를 생성할 수 있다.

13. badges

A flutter package for creating badges. Badges can be used for an additional marker for any widget, e.g. show a number of items in a shopping cart.

배지를 생성할 수 있다.

14. percent_indicator

Library that allows you to display progress widgets based on percentage, can be Circular or Linear, you can also customize it to your needs.

원 그래프와 막대 그래프를 활용하여 진행상태를 표현할 수 있다.

15. path

A string-based path manipulation library. All of the path operations you know and love, with solid support for Windows, POSIX (Linux and Mac OS X), and the web.

파일시스템 경로에 접근할 수 있다.

16. pin_code_fields

A flutter package which will help you to generate pin code fields. Can be useful for OTP for example.

핀번호 입력화면을 표현할 수 있다.

17. package_info_plus

Flutter plugin for querying information about the application package, such as CFBundleVersion on iOS or versionCode on Android.

앱 정보 데이터에 접근할 수 있다.

18. flutter_rating_bar

A simple yet fully customizable ratingbar for flutter which also include a rating bar indicator, supporting any fraction of rating.

평가(별점) 입력창을 표현할 수 있다.

19. camera

A Flutter plugin for controlling the camera. Supports previewing the camera feed, capturing images and video, and streaming image buffers to Dart.

카메라 자원을 활용할 수 있다.

20. device_info_plus

Flutter plugin providing detailed information about the device (make, model, etc.), and Android or iOS version the app is running on.

디바이스 데이터에 접근할 수 있다.

21. auto_size_text

Flutter widget that automatically resizes text to fit perfectly within its bounds.

위젯 크기에 맞춰서 글씨 크기를 조절해줌.

22. equatable

A Dart package that helps to implement value based equality without needing to explicitly override == and hashCode.

== 없이 오브젝트 일치여부를 확인할 수 있음.

23. flutter_native_splash

Customize Flutter's default white native splash screen with background color and splash image. Supports dark mode, full screen, and more.

스플래시 화면을 만들어줌.

24.video_player

Flutter plugin for displaying inline video with other Flutter widgets on Android, iOS, and web.

비디오 플레이어를 제공해줌.

25. lottie

Render After Effects animations natively on Flutter. This package is a pure Dart implementation of a Lottie player.

애니메이션 플레이어를 제공해줌.

26. flutter_staggered_grid_view

Provides a collection of Flutter grids layouts (staggered, masonry, quilted, woven, etc.).

다양한 그리드 레이아웃을 제공해줌.

27. photo_view

Photo View provides a gesture sensitive zoomable widget. Photo View is largely used to show interactive images and other stuff such as SVG.

확대가능한 이미지 위젯을 제공해줌.

28. flutter_screenutil

A flutter plugin for adapting screen and font size. Guaranteed to look good on different models

적응형 UI에 활용할 수 있음.

29. fl_chart

A powerful Flutter chart library, currently supporting Line Chart, Bar Chart and Pie Chart.

그래프 그리는데 활용할 수 있음.

30. share_plus

Flutter plugin for sharing content via the platform share UI, using the ACTION_SEND intent on Android and UIActivityViewController on iOS.

공유하기 기능을 활용할 수 있음.

https://pub.dev/packages?q=platform%3Aandroid+platform%3Aios&page=2

Flutter widgets are built using a modern framework that takes inspiration from React.

The central idea is that you build your UI out of widgets. Widgets describe what their view should look like given their current configuration and state. When a widget’s state changes, the widget rebuilds its description, which the framework diffs against the previous description in order to determine the minimal changes needed in the underlying render tree to transition from one state to the next.

UI는 state를 기반으로 만들어진다. state이 변하면 이전 UI tree와 비교해서 달라진 부분에 대해서만 렝더링을 한다. 이 핵심 아이디어는 리액트로 부터 영감을 받았다.

2. runApp()의 역할은 무엇인가?

The runApp() function takes the given Widget and makes it the root of the widget tree.

3. wiget이 무엇인가?

A widget’s main job is to implement a build() function, which describes the widget in terms of other, lower-level widgets.

build function을 실행해서 화면을 만드는 역할을 맡음.

You might wonder why StatefulWidget and State are separate objects. In Flutter, these two types of objects have different life cycles. Widgets are temporary objects, used to construct a presentation of the application in its current state. State objects, on the other hand, are persistent between calls to build(), allowing them to remember information.

다른 요소와의 차이를 통해서 그것을 명확하게 이해하기 쉬움. widget은 state과 비교하여 명확하게 이해할 수 있는 것 같음. widet은 화면을 그리는 역할을 맡는 구성요소. state은 화면을 그리는 재료를 제공하는 구성요소. 역할이 다르고, 그렇기 때문에 생명주기도 다름.

Notice the creation of two new stateless widgets, cleanly separating the concerns of displaying the counter (CounterDisplay) and changing the counter (CounterIncrementor). Although the net result is the same as the previous example, the separation of responsibility allows greater complexity to be encapsulated in the individual widgets, while maintaining simplicity in the parent.

이런식으로 관심과 역할을 구분해서 구축해나가는 것은 복잡한것을 단순하게 만들어서 복잡성을 다룰 수 있도록 만들어줌.

4. stateful wiget과 stateless widget은 왜 구분되는가?

So far, this page has used only stateless widgets. Stateless widgets receive arguments from their parent widget, which they store in final member variables. When a widget is asked to build(), it uses these stored values to derive new arguments for the widgets it creates. In order to build more complex experiences—for example, to react in more interesting ways to user input—applications typically carry some state. Flutter uses StatefulWidgets to capture this idea. StatefulWidgets are special widgets that know how to generate State objects, which are then used to hold state.

In more complex applications, different parts of the widget hierarchy might be responsible for different concerns; for example, one widget might present a complex user interface with the goal of gathering specific information, such as a date or location, while another widget might use that information to change the overall presentation.

개발자 입장에서는 어떤 위젯이 그 자체로 상태를 포함해야 한다면, 그건 꽤 복잡한 컴포넌트가 될 것 같음. stateless 컴포넌트를 품고 있는 부모 컴포넌트가 statefule 컴포넌트가 될 것 같음.

When writing an app, you’ll commonly author new widgets that are subclasses of either StatelessWidget or StatefulWidget, depending on whether your widget manages any state.

설계자 입장에서는 리소스 자원을 효과적으로 관리하기 위해 구분했다고 생각함. 상태에 따라 화면을 다시 렌더링하는 프로세스는 비싼 작업이기 때문에 이 작업이 필요한 곳과 필요하지 않은 곳을 구분하는 것은 신경써야하는 곳과 쓰지 않아도 되는 곳을 구별할 수 있기 때문에 도움이 되지 않을까? 그런데 구체적으로 무엇이 어떻게 좋은지에 대해서는 잘 모르겠음.

6. widget component는 어떻게 만들어지는가?

The MyAppBar widget creates a Container with a height of 56 device-independent pixels with an internal padding of 8 pixels, both on the left and the right. Inside the container, MyAppBar uses a Row layout to organize its children. The middle child, the title widget, is marked as Expanded, which means it expands to fill any remaining available space that hasn’t been consumed by the other children. You can have multiple Expanded children and determine the ratio in which they consume the available space using the flex argument to Expanded.

Many widgets use a GestureDetector to provide optional callbacks for other widgets. For example, the IconButton, RaisedButton, and FloatingActionButton widgets have onPressed() callbacks that are triggered when the user taps the widget.

Appbar는 Container와 Row 등의 기본 컴포넌트를 활용하여 만들어져있다. Button은 GestureDector 등의 기본 컴포넌트를 활용하여 만들어져있다. 머터리얼 디자인시스템 역시 내가 디자인시스템 컴포넌트를 만드는 원리와 동일한 원리로, 유저들이 사용하기 쉽게 기존의 것들을 조합하여 만들어진 것이다.

6. key는 왜 필요한걸가?

By assigning each entry in the list a “semantic” key, the infinite list can be more efficient because the framework syncs entries with matching semantic keys and therefore similar (or identical) visual appearances. Moreover, syncing the entries semantically means that state retained in stateful child widgets remains attached to the same semantic entry rather than the entry in the same numerical position in the viewport.

위젯에 정체성을 부여해서 뭔가 보다 효과적으로 처리하기 위해 필요한 것 같은데, 구체적으로 뭐를 어떻게 효과적으로 처리하는지는 잘 이해가 안된다.

7. flutter의 state는 어떤 life cycle을 갖는가?

After calling createState() on the StatefulWidget, the framework inserts the new state object into the tree and then calls initState() on the state object. A subclass of State can override initState to do work that needs to happen just once. For example, override initState to configure animations or to subscribe to platform services.

createState 후 initState 작동됨.

If you wish to be notified when the widget property changes, override the didUpdateWidget() function, which is passed as oldWidget to let you compare the old widget with the current widget.

state이 변경되면 didUpdateWidget 작동됨.

When a state object is no longer needed, the framework calls dispose() on the state object. Override the dispose function to do cleanup work

state이 더이상 필요없을 때 dispose 작동됨.

8. state이 변동되면 widget은 어떻게 렌더링되는가?

When handling the onCartChanged callback, the ShoppingListState mutates its internal state by either adding or removing a product from shoppingCart. To signal to the framework that it changed its internal state, it wraps those calls in a setState() call. Calling setState marks this widget as dirty and schedules it to be rebuilt the next time your app needs to update the screen.

setState으로 감싸진 부분이 호출되면, 해당 state이 변동된 형태로 복제되고, 변동된 부분에 대해서 리-렌더링해야 한다는 스케쥴이 잡힌다음 리-렌더링이 진행됨.

https://flutter-ko.dev/docs/development/ui/layout

In computer science, type safety and type soundness are the extent to which a programming language discourages or prevents type errors.

The Dart language is type safe

Revealing type-related bugs at compile time.

More readable code. More maintainable code.

개발자들이 타입에러를 발생시키는 것을 방지할 수 있도록 도와주기 위해서.

2. type safe는 반드시 지켜야 하는걸까?

Although types are mandatory, type annotations are optional because of type inference.

it uses a combination of static type checking and runtime checks to ensure that a variable’s value always matches the variable’s static type, sometimes referred to as sound typing.

필수적으로 지켜야하는 것은 아니다. 왜냐면 다크 컴파일러 차원에서 타입을 추론할 수 있기 때문. 그래서 다트 디버거는 타입을 이중으로 체크해준다. 컴파일 할때 명시적으로 잘못된 타입선언을 체크해주고, 런타임 중에 암시적으로 잘못된 타입선언을 체크해준다.

3. dart의 type system은 soundness 할까?

Soundness is about ensuring your program can’t get into certain invalid states.

A sound type system means you can never get into a state where an expression evaluates to a value that doesn’t match the expression’s static type.

다트의 type system은 절반정도 soundness한게 아닌가 싶다. 왜냐면 암시적으로 type을 선언할 수 있기 때문에 런타임 단계에서 type 에러가 발생할 수 있기 때문. 암시적 선언을 열어둔것은 아마도 개발자의 자유도를 보장해주기 위함이 아닌가 싶지만, 자유도가 높아진 많큼 에러가능성도 동시에 높아진다는 트레이드 오프가 있다.

4. 변수와 관련된 consumer와 producer는 뭘까?

Consider the following simple assignment where Cat c is a consumer and Cat() is a producer: Cat c = Cat();

지금껏 무수히 많은 변수를 선언해왔지만, 왼쪽이 consumer고 오른쪽이 producer라는 프레임으로 본적이 없다. ㅎㅎ;; 이렇게 개념을 하나 알게되니 흥미롭다. 내가 알던 현상을 정리하는 느낌이 즐겁다.

5. 다트팀이 생각하는 효과적으로 코드를 작성하는 원칙?

Be consistent. When it comes to things like formatting, and casing, arguments about which is better are subjective and impossible to resolve. What we do know is that being consistent is objectively helpful. If two pieces of code look different it should be because they are different in some meaningful way. When a bit of code stands out and catches your eye, it should do so for a useful reason.

The Dart analyzer has a linter to help you write good, consistent code. If a linter rule exists that can help you follow a guideline, then the guideline links to that rule.

양식을 코드베이스에 일관적으로 적용하기. 마치 하나의 책에서 문체가 달라지면 안되는 것과 같음. 문체를 일관적으로 적용하기 위해 린터러는 도구를 활용할 수 있다.

If there are multiple ways to say something, you should generally pick the most concise one.

제일 간견할 문체를 사용하기.

6. 다트팀이 다트 언어를 개발한 동기?

Dart was designed to be familiar, so it inherits many of the same statements and expressions as C, Java, JavaScript and other languages. But we created Dart because there is a lot of room to improve on what those languages offer. We added a bunch of features, from string interpolation to initializing formals, to help you express your intent more simply and easily.

다른 언어들 속에서 보다 개선할 수 있는 아이디어를 발견할 수 있어서. 언어역시 서비스다. 모든 서비스가 출발점은 비슷하다. 불편에서 시작하는 것. 사실 언어는 주어진 것. 당연한 것. 으로 생각하기 쉬워서 처음 언어역시 서비스라는 생각이 들었을 때 무척이나 신선했음.

https://dart.dev/guides/language/effective-dart#the-guides

Material is a design system created by Google

머터리얼 디자인은 구글의 디자인 시스템이다.

2. 머터리얼 디자인은 왜 머터리얼이라는 이름을 갖었을까?

Material Design is inspired by the physical world and its textures, including how they reflect light and cast shadows. Material surfaces reimagine the mediums of paper and ink.

To replicate real products as closely as possible, each study identifies users, displays functional user flows, and applies real-world restrictions.

(추측) 머터리얼 디자인은 물리적 현실을 은유적으로 반영하고 있기 때문에 머터리얼(물질)이라는 일므을 붙인게 아닐까?

3. 머터리얼 디자인으로 무엇을 할 수 있을까?

Material Components are interactive building blocks for creating a user interface

머터리얼 디자인이 제공하는 컴포넌트들을 조립해서 어플리케이션을 만들 수 있다.

4. 머터리얼 디자인으로 무엇을 할 수 있을까?

Display: Placing and organizing content using components like cards, lists, and sheets.

Navigation: Allowing users to move through the product using components like navigation drawers and tabs.

Actions: Allowing users to perform tasks using components such as the floating action button.

Input: Allowing users to enter information or make selections using components like text fields, chips, and selection controls.

Communication: Alerting users to key information and messages using components such as snackbars, banners, and dialogs.

유저에 정보를 정적으로 보여줄 수 있다. 유저에 정보를 동적으로 보여줄 수 있다. 유저가 정보를 입력하게 할 수 있다. 유저가 앱에서 이동하게 할 수 있다. 유저가 앱에서 선택하게 할 수 있다.

생각해보면 이것이 프로그램으로 할 수 있는 모든것이다.

5. 머터리얼 디자인은 무엇으로 구성되어 있을까?

Material’s color system is an organized approach to applying color to a UI.

Important attributes, such as the typeface, font weight, and letter case, can be modified to match your brand and design.

Applying shape styles can help direct attention or identify components, communicate their state, and express your brand.

색깔. 모양. 글자. 별거는 아닌데 디자인을 바라보는 프레임을 장착한 느낌.

6. 머터리얼 디자인이 일관적으로 지키는 원칙은 무엇일까?

Actionable : Bottom app bars highlight important screen actions and raise awareness of the floating action button.

Flexible : A bottom app bar's layout and actions change based on the needs of the screen.

Ergonomic : The bottom app bar is easy to reach from a handheld position on a mobile device.

중요한 것은 강조하고 / 반복되는 것은 재사용할 수 있게 하고 / 유저가 사용하기에 편리한 디자인.

7. 머터리얼 디자인은 디자인 시스템 컴포넌트 설명에 어떤 내용을 정리하고 있나?

Usage / Principles / When to use / Anatomy /

해당 컴포넌트로 뭘 할 수 있는지 (Usage) 해당 컴포넌트의 정적/동적 구성요소에 대한 설명 (Anatomy) 해당 컴포넌트가 활용될 수 있는 상황/없는 상황 (Example)

8. 머터리얼 디자인의 주요 컴포넌트로는 뭐가있나?

• Navigation : Bottom Navigation

• Touch : CheckBox, Chip, Picker

• Keyboard :

• Information : Card, Chip, Table, Divider

• Notification : Banner, Dialog

AppBar - Top/Bottom

BackDrop