나만의 브라우저 시작페이지3.0 - 시작페이지 꾸미기

Git을 공부해 볼 겸, 이전에 나만의 시작페이지에 대한 불편한 점을 보완하고자 회사에서 조금 쉴 때, 퇴근하고, 주말에, 틈틈이 시간 내어 대규모 업데이트를 하였다.

그냥 완전히 다른 프로그램이고, 복붙한 코드도 있어서 J쿼리인 것도 있고 아닌 것도 있고.. ㅋㅋ

이전 버전

나만의 브라우저 시작페이지

이전 버전에서는 바로가기가 5개, 클립보드도 버튼형식이라 불편함 그리고 클립보드 버튼 누르면 권한수락 나와서 너무 불편했고, 번역은 뭐 쓰지도 않았다.

가장 바뀐것이 바로가기, 클립보드, 검색엔진이며, 새 탭 옵션과 클립보드 바로가기옵션, 다크모드 등 다양한 기능을 추가하고 Git으로 `commit`, `push`, `pull` 기능들을 초보자 수준에서 많이 사용해 보았다.

웹 사이트로 사용 - netlify

netlify로 GitHub와 연동하여 항상 최신 버전으로 사용할 수도 있다.

나는 시작 페이지를 netlify로 하여 사용중이다.(인터넷 속도 때문에 이전 버전보다 딜레이가 생겼다.)

시작페이지

위 사이트는 나중에 시간이 지나면 아래 스크린샷 사진들과 많이 달라질 수 있다.

GitHub

GitHub - hbcha0916/QuickSearch: 나만의 시작페이지 입니다.

---

웹 시작 페이지 커스텀하기

대학교 웹프로그래밍 기초 중간고사 프로젝트(ver 1.0) , 대학교 웹프로그래밍 기초 기말고사 프로젝트(ver 2.0) 에서부터 딱 1년 뒤 현업에서 사용하기 위해 업데이트(ver 3.0)까지 올라왔다.

1.0

1.0 버전에선 현재 3.0 버전까지의 기초가 되는 뼈대 역할을 하였다.

바로가기 링크는 단순히 html의 table 태그 안에 이름과 링크를 집어 넣어 사용자 지정 바로가기를 사용할 수 없었다.

그래도 2.0 전까지 자주 사용했었는데, 나는 총 2개의 모니터를 사용하고 시작 페이지를 한쪽에 띄워놓고 작업을 하다 보니 시계가 있었으면 좋겠고, 시간이 지남에 따라 자주 사용하는 사이트가 달라지기 때문에 바로가기를 좀 더 유연하게 바꾸고 싶다는 개선점이 생겼다. 이 개선점을 2.0 때 보완하였다.

2.0

지금 3.0을 올린 시점이 딱 대학생 기말고사 시즌이니 2.0을 1년동안 사용해 왔다.

여기서는 바로가기 개수가 너무 적고 위에서 말했다시피 클립보드가 불편함 실수로 우클릭 누르면 바로가기 수정창 나옴 등 불편했지만 바로가기 키를 너무 잘 사용했었다. 물론 구글 크롬 기본 홈에서도 사용할 수 있지만 난 그냥 내가 만든 걸 사용하고 싶었다.

그리고 가끔 인터넷 기록삭제를 하면 로컬 스토리지가 다날아가서 좀 개빡쳤었다.

지금까지는 1 단위로 버전업을 했지만 이젠 "GitHubUser"로써, 3.0부터는 3.1 , 3.2... 수정할 부분과 앞으로 더 많이 얻게 될 프로그래밍 지식으로 버전업을 할 수 있을 것 같다.(이것도 3.0이 사용하기에는 조금 덜 유연하고 번거롭다고 생각해야 하지, 너무 만족스러우면 안 할 것 같다.ㅋㅋ)

3.0 버전 및 버전 설명

회사에서 점심 먹고 10분, 20분 그리고 퇴근해서 구글링과 GPT한테 물어보고 남들이면 진작에 만들었을걸 난 남들보다 조금 더 걸린 것 같다.

여전히 코드는 저수준에 보기 좋지 않다.

하지만 알아야 할 건 난 프런트엔드 개발자가 아니다..ㅋ

여전히 배경화면은 그대로 사용 중이다. 난 저사진이 너무 좋다.

저기의 위치는 아래 나와있다 ㅋㅋ

네이버 지도

충북 괴산읍이다. 공기가 매우 좋다.

빠른 검색

매우 중요시하는 기능 중 하나이다.

난 번거로운 게 매우 싫다. 무조건 적은 행동으로 빠른 검색을 하는 게 좋다.

1. 허공에다가 붙여놓기 단축키(ctrl+v) 키를 누르면 바로 선택되어 있던 검색엔진으로 검색한다.(옵션으로 끌 수 있다.)
2. 다이렉트 바로가기를 정말 많이 추가할 수 있다.(개수는 따로 리밋 걸어두지 않았음, 모니터 해상도에 따라 더 많이 추가 가능)

로컬스토리지 기반 설정

로컬스토리지 기반으로 모든 설정값들을 저장한다.

인터넷 기록을 주기적으로 삭제해 주는 사람들을 위해(나를 위해) 설정값을 json으로 추출하고 json으로 불러오는 기능도 추가하였다.

j쿼리 사용

물론 복붙을 해서(바꾸기 귀찮아서) 아닌 부분도 있지만 그래도 j쿼리를 써보려고 노력했다.

---

깃허브도 공부할 겸, 겸사겸사 Git을 주로 사용하는 것을 목적으로 만들어 보았는데 너무 좋은 것 같다.

특히 README.md 가 노션에서 작성하고 바로 올리면 딱히 수정하지 않아도 돼서 너무 좋았다.

Tistory는 그런 게 참 아쉬운 것 같다.(N2T 쓰면 되지만 다크모드와 호환성이 좋지 못하다. 차라리 다시 타이핑을 하지..)

---

더 자세한 건 깃허브에 설명되어 있다.