Obsidian에서 Vim 모드를 사용할때, Insert 모드에서 한글을 사용하다 Normal 모드로 전환하면 명령어가 제대로 동작하지 않는 이슈가 있다. 이러한 이슈는 vscode에서 vim을 사용할때 일어나는 문제와 비슷하다. 문제 해결 방법도 유사하다.

이 문서는 Mac OS를 타겟으로 작성했습니다.

1. im-select 설치

brew tap daipeihust/tap
brew install im-select

위 명령어를 terminal에 입력하여 설치합니다.

which im-select

which 명령어를 통해 im-select의 설치 경로를 파악합니다. 저의 경우 /opt/homebrew/bin/im-select 였습니다.

which로 파악한 경로를 잘 기억해둡니다.

2. Vim Plugin을 활성화

3. Obsidian Plugin Vim IM Control 설치

Community Plugins에서 vim-im-select-obsidian를 찾아 설치합니다.

4. 완료

Obsidian을 종료 후 다시 실행해서 잘 되는지 확인해보자!

BuildContext

처음에는 개발하기 바빠서 이것에 대한 정확한 개념도 모른체 라이브러리, api 설명서에 나와있는 그대로 따라쓰기만 했다. 그러나 개발하면 개발할수록 이게 굉장히 중요한것 같다는 느낌을 받았고... buildcontext에 대해 제대로 이해하지 못하고 넘어간다면 Flutter 전문가? 가 되기 위해 나아가는 과정에서 기초 공사부터 부실하게 되는것이라는 생각이 들었다.

그래서 이 글을 통해 BuildContext가 무엇인지 정리하는 시간을 갖고자 한다.

그래서 BuildContext가 뭐죵?

먼저 겉핥기 수준으로 알아보자.

Flutter 공식 문서를 통해 정의를 살펴보면

A handle to the location of a widget in the widget tree. 위젯 트리에서 위젯의 위치를 다루는 것.

라고 한다. ... ... 정리 끝.

이라 하면 열받는다.

이걸로는 쉽게 이해가 되지 않는다.

먼저 알아야 할 것은 Flutter 안에 모든 Widget은 내부에 build method를 가지고 있다는 것이다. 그리고 그 build method 의 타입은 Widget이고 인자 값으로 BuildContext를 가진다.

Widget build(BuildContext context){
  // example ...
  return Scaffold(...) <- widget
}

build 메소드를 통해서 위젯을 반환하고 그 안에 buildcontext를 집어넣는다.

그 다음 중요한 buildcontext의 두번째 개념이 등장한다.

Each widget has its own BuildContext, which becomes the parent of the widget returned by the StatelessWidget.build or State.build function 모든 위젯은 자신만의 BuildContext를 가지고 있고, 그것은 StatelessWidget.build or State.build에 의해 반환되는 위젯의 부모가 된다.

이것이 의미하는것이 무엇인지 예제를 통해 보자.

class MainPage extends stateless{
  @override
  Widget build(BuildContext context){
    return Scaffold(
      appBar: ...(),
      body : Center(
          child: RaisedButton(
          onPress : () {
          // 여기서 Snackbar 라던가 dialog를 다뤄야한다
          // 면 Scaffold의 context 가 필요하다. 그래서 일반
          // 적으로 생각하면 MainPage의 build 에서 넘어온 
          // context 를 접근하면 된다고 생각하기 쉽다.
          // 그러나 그렇게 하게 되면 
          // Scaffold.of() called with a context
          // that does not contain a scaffold. 와 같은 
          // 에러 메시지를 보게 될 것이다.

          },
          child: Text('Press'),
        )
      )
    )
  }

}

왜 위 예제와 같은 상황이 벌어지는 것일까? 그것은 buildcontext의 두번째 개념을 생각해보면 해결이 된다. 두번째 개념을 통해 보면 build 메소드의 인자값에 있는 context는 return 되는 scaffold 의 부모의 context이다.

부모의 context에는 부모 위젯까지의 정보 밖에 없다. 즉 build 메소드를 통해 return 되는 위젯의 정보는 없는 것.

그렇기 때문에 이 build 메소드의 context에서 scaffold의 대한 context 정보를 찾지 못하는 것이다.

그래서 예제의 에러가 발생하는 것. 이것을 해결하기 위해서는 (무조건 새로운 context를 만들어 사용하는) builder 위젯을 사용하거나 scaffold의 context 정보를 받기 위해 별개로 분리해서 자식 위젯을 만들어 보내는 방법이 있다.

일차적으로 정리하자면...

• BuildContext는 위젯의 정보를 가지고 있는것이며,
• build 메소드에 의해 전해지는 context는 부모 위젯까지의 정보만을 가지고 있다.

이번에는 간단하게 여기까지만 정리하고, 다음 포스팅에는 BuildContext가 뭔지 조금 더 자세히 살펴보겠다. 그와 더불어 widget tree, element tree, render tree 까지..!

일단 나의 경우. 처음부터 너무 거창한 것을 생각하는것 같다.

무슨 대단한 글을 쓰겠다고... 대단한 실력을 가진것도 아닌데...

머릿속에는 이미 코드 컴플리트를 잇는 대작을 집필하고 있다.. ㅋㅋ 그러다보니 그것을 행동으로 옮기자니 너무 두렵다.

그래서 생각한것은.. 지나가는 갓난 아이라도 아는거라도 글로 써보자는 것이다.

설사 그게 hello world. 한줄 찍는 것이라도

프로그래밍할때도 처음부터 몇만줄짜리 프로그램을 머리속으로만 백날 생각하고 모델링하는 것보다는 에라 모르겠다 한줄씩이라도 써보자 하는 자세가 때로는 도움이 되는 것처럼!

나 오늘부터 시작하리...

실무하면서 배운점을 정리하고 내 생각을 공유해야징.

주로 다룰 주제들

• Flutter, Dart
• Javascript
• DB 조금..?