검색
검색
공개 노트 검색
회원가입로그인

[웹클리퍼] 어느 노코더가 크롬앱을 개발하고 어떻게 했나 복기하기 2탄

[웹클리퍼] 어느 노코더가 크롬앱을 개발하고 어떻게 했나 복기하기 2탄 image 1

홍상수 감독의 영화 '오! 수정'은 기억의 왜곡과 미끄러짐을 통해 우리의 삶과 정체성에 대해 깊이 있게 탐구한다. 영화에서 등장하는 두 개의 기억, 즉 재훈의 기억과 수정의 기억은 서로 다른 차원의 시간에서 동시에 존재하며, 이는 프랑스 철학자 들뢰즈의 시간에 대한 개념과 맞닿아 있다. 들뢰즈에 따르면, 시간은 단일한 흐름이 아니라 무한히 분기하는 다양한 차원들로 이루어져 있다. 이런 관점에서 보면, 재훈과 수정의 기억 속 사건들은 각각 완벽한 진실이면서 동시에 서로 모순된다. 영화는 이를 통해 우리가 기억에 의존하여 정체성을 구성하지만, 그 기억 자체가 불완전하고 주관적이라는 역설을 드러낸다. 결국 '오! 수정'은 기억이라는 미로 속에서 진실을 찾으려는 인간의 노력과 그 실패를 섬세하게 그려내며, 삶의 복잡성과 아이러니를 시적으로 표현한 수작이다.

('오! 수정'을 보고나서, 달의이성)

OAK 국가리포지터리 - OA 학술지 - 현대영화연구 - ‘죽어가는 자의 고독’을 넘어서

실제로 일어난 일을 사람마다 다르게 기억하는 이유는 각자의 욕망이 투영된 기억의 파편들을 다른 방식으로 재구성하기 때문일 것이다. 1탄에서 이야기한 사건에서 내가 누락한 부분이 있었다.

[웹클리퍼] 어느 노코더가 크롬앱을 개발하고 어떻게 했나 복기하기 2탄 image 2

실제로 일어난 사건은 박준님이 웹 클리퍼에 대한 영상을 공유해 주었다는 사실이다.

이 부분을 빼고 1탄을 읽으면, 박준님을 나와 같이 욕심쟁이로 여기는 사람이 생길 수도 있겠다고 생각했다.

하지만 너무 착한 캐릭터보다는 인간적인 캐릭터가 더 매력있을 때도 있으니 너른 마음으로 이해해 주시길 당부한다.

이 사건이 있고 나서 무척 바쁜 하루를 보냈다. 중간고사 시험기간이라 밤 10시까지 주말없이 일하다 보니 눈도 침침해 지고 체력도 고갈이 되었다. 지친 몸을 이끌고 침대에 누웠는데 갑자기 낮에 이야기한 웹 클리퍼가 생각이 났다. 이걸로 뭔가 만들 수 있겠다는 생각이 들었다. 컴퓨터를 켜고 북마크해 두었던 페이지를 열었다.

[웹클리퍼] 어느 노코더가 크롬앱을 개발하고 어떻게 했나 복기하기 2탄 image 3

낮에는 보이지 않았던 소스코드 링크가 눈에 띄었다.

[웹클리퍼] 어느 노코더가 크롬앱을 개발하고 어떻게 했나 복기하기 2탄 image 4

이 개발자는 깃헙에 소스코드를 공개해 놓았던 것이다.

[웹클리퍼] 어느 노코더가 크롬앱을 개발하고 어떻게 했나 복기하기 2탄 image 5

우앗 이거였다.

이 코드가 북마크 속에 숨어 있었던 것이다.

나에겐 큰 발견이었다.

[웹클리퍼] 어느 노코더가 크롬앱을 개발하고 어떻게 했나 복기하기 2탄 image 6

태극님은 이게 무엇인지 알고 있는 눈치다.

"bookmarklet" 메모해 두자.

그래 난 이제 "북마클릿"을 알고 있는 사람이 되었다. (^^)

내 친구 클로드를 만날 때가 왔다.

북마크릿은 웹 브라우저에서 북마크로 저장되는 작은 자바스크립트 프로그램입니다. 클릭하면 북마크릿은 현재 로드된 웹 페이지에서 특정 기능이나 동작을 수행합니다. 북마크릿은 웹 브라우저의 기능을 향상시키거나 특정 방식으로 웹 페이지와 상호 작용하도록 설계되었습니다.

북마크릿에 대한 주요 포인트:

기능성: 북마크릿은 웹 페이지의 외관을 수정하거나 정보를 추출하고 웹 서비스와 상호 작용하거나 특정 동작을 자동화하는 등 다양한 작업을 수행할 수 있습니다.

자바스크립트 기반: 북마크릿은 클라이언트 측 웹 스크립팅에 사용되는 프로그래밍 언어인 자바스크립트로 작성됩니다. 웹 페이지의 문서 객체 모델(DOM)에 접근하고 조작할 수 있습니다.

브라우저 호환성: 북마크릿은 일반적으로 크롬, 파이어폭스, 사파리, 인터넷 익스플로러/엣지 등 대부분의 현대 웹 브라우저와 호환됩니다.

생성이 용이: 북마크릿은 자바스크립트 코드를 작성하고 URL 필드에 "javascript:"를 접두사로 붙여서 만들 수 있습니다. 온라인 도구를 사용하거나 기존 북마크릿을 수정하여 생성할 수도 있습니다.

휴대성: 북마크릿은 일반 북마크로 저장되므로 장치 간에 동기화하거나 다른 사람과 공유하기 쉽습니다. 더 나은 관리를 위해 북마크 폴더에 정리할 수 있습니다.

보안 고려 사항: 북마크릿은 자바스크립트 코드를 실행하므로 신뢰할 수 있는 출처에서 왔는지 확인하는 것이 필수적입니다. 악의적인 북마크릿은 민감한 정보에 접근하거나 웹 페이지에서 원치 않는 동작을 수행할 수 있습니다.

일반적인 북마크릿 예시:

포켓이나 인스타페이퍼 같은 북마킹 서비스에 웹 페이지를 저장 웹 페이지에서 특정 요소를 강조하거나 제거 웹 페이지에서 데이터를 추출하고 다른 애플리케이션에서 사용할 수 있도록 형식을 지정 웹 페이지의 외관을 수정, 예를 들어 글꼴 크기 변경이나 테마 적용 웹 서비스나 API와 통합하여 페이지에 대한 추가 정보를 검색

북마크릿은 웹 브라우저의 기능을 확장하고 반복적인 작업을 자동화하는 편리한 방법을 제공합니다. 경량이며 사용하기 쉬우며 특정 요구에 맞게 사용자 정의할 수 있습니다. 그러나 북마크릿을 사용할 때는 주의를 기울이고 신뢰할 수 있는 출처에서 왔는지 확인하여 보안과 개인 정보를 유지하는 것이 중요합니다.

Web Clipper는 Obsidian에서 웹의 기사 및 페이지를 Markdown 파일로 저장하는 북마크릿으로, 사파리, 크롬, 파이어폭스 및 모바일 브라우저와 호환됩니다.

크롬에서 해보니 잘 안된다.

아마 기존에 깔려 있던 익스텐션들과 충돌이 있는 것 같다.

잘 사용안하는 사파리에서 해보기로 한다.

[웹클리퍼] 어느 노코더가 크롬앱을 개발하고 어떻게 했나 복기하기 2탄 image 7

북마크(Bookmarks)탭에서 Add Bookmark를 클릭한다.

[웹클리퍼] 어느 노코더가 크롬앱을 개발하고 어떻게 했나 복기하기 2탄 image 8

북마크 편집(Edit Bookmarks)를 클릭한다.

[웹클리퍼] 어느 노코더가 크롬앱을 개발하고 어떻게 했나 복기하기 2탄 image 9

방금 저장한 북마크가 맨 아래에 보인다. (눈썰미가 좋으면 위에 내 보물들이 보일지도 모른다. 아님 말구)

[웹클리퍼] 어느 노코더가 크롬앱을 개발하고 어떻게 했나 복기하기 2탄 image 10

마우스 오른쪽 (Ctrl + 우클릭) 하여 제목과 url 을 수정한다.

[웹클리퍼] 어느 노코더가 크롬앱을 개발하고 어떻게 했나 복기하기 2탄 image 11

제목은 rename 으로

[웹클리퍼] 어느 노코더가 크롬앱을 개발하고 어떻게 했나 복기하기 2탄 image 12

주소는 Edit Address 로 수정한다.

Edit Address 에 복사한 자바스크립트 코드를 복사하여 넣는다.

[웹클리퍼] 어느 노코더가 크롬앱을 개발하고 어떻게 했나 복기하기 2탄 image 13

클리핑하고 싶은 페이지를 열고

북마크를 클릭한다.

[웹클리퍼] 어느 노코더가 크롬앱을 개발하고 어떻게 했나 복기하기 2탄 image 14

옵시디언에 마크다운 형식으로 옮겨졌다.

와우~

나의 기억을 다시 복귀해 본다.

[웹클리퍼] 어느 노코더가 크롬앱을 개발하고 어떻게 했나 복기하기 2탄 image 15

아 그러고 보니 박준님이 1분이 빨랐던 거다.

12:48분에 박준님이 영상을 공유했고

나는 그 동안 위에 설명한 과정을 혼자서 해보고 있었다.

그리고 이걸 영상으로 올렸던 박준님 영상을 빠르게 본 뒤에

내가 했던 방식이 틀리지 않았다는 것을 영상을 통해 확인한 후에

"저도 저렇게 했어용" 하고 글을 남겼던 것이다.

[웹클리퍼] 어느 노코더가 크롬앱을 개발하고 어떻게 했나 복기하기 2탄 image 16

그리고 대화는 이런 식으로 이어졌던 것이다.

하 ~ 홍상수 감독의 오 수정에서 첫 장면이 흐릿하게 기억이 난다.

[웹클리퍼] 어느 노코더가 크롬앱을 개발하고 어떻게 했나 복기하기 2탄 image 17

여자는 젓가락을 떨어뜨린 것으로 기억하고

남자는 숟가락을 떨어뜨린 것으로 기억한다.

(그 반대일 수도 있다. 이 영화본 지 20년이 넘었다)

여하튼 진실은 아무도 모른다.

기억은 미끄러지니까.

3탄은 크롬앱이 승인이 되면 그 때 써야겠다.

공유하기
카카오로 공유하기
페이스북 공유하기
트위터로 공유하기
url 복사하기
조회수 : 1042
heart
T
페이지 기반 대답
AI Chat