슬기로운 개발자

웹페이지에서 모달창을 사용하는데 있어 문제점들을 해결하고 이 내용을 다시 정리해보았다. 1. 모달창 활성화시 바디 스크롤 방지 모달창에서 마우스 휠을 사용하면 바디 스크롤이 같이 움직이는 경우가 있었다. 웹페이지 모달창에 사용한 carousel이 작동하기 어려워서 모달창이 열렸을 때만 바디 스크롤이 없어지도록 했다. 여러 가지 방법이 있지만 가장 간단한 방법은 바디 스크롤이 적용된 구간 의 상위 태그를 모달창 활성화시 overflow:hidden 처리하는 것으로 해결했다. css는 .addClass()로 적용했다. 2. 모달창 비활성화시 바디 스크롤 (1의 반대) 반대로 모달창이 비활성화 되었을 때는 바디 스크롤이 작동해야 하므로 1번에서 addClass() 한 것을 다시 반대로 해제하기 위해 .remo..

github 저장소를 소개하는 readme 작성시 필요한 내용을 정리했다. readme 작성은 중요하지만 개발 생각만 하는 순간 간과하게 되는 부분인 것 같다. 대부분의 깃헙을 잘 관리하는 개발자들은 readme의 중요성을 이야기하고 있고 나 역시 놓치고 싶지 않은 부분이라고 생각되서 블로그에 정리하면서 주의하고자 한다. 반드시 들어가야 한다고 생각하는 부분(1~3번 항목) 크게 나누면 아래와 같다. 1. 프로젝트 계획 이유와 프로젝트에 대한 설명(Description) github에 오픈소스로 코드를 올리면서 또는 협업을 위해 다른 개발자들도 내 저장소를 보기 때문에 저장소에 대한 소개는 반드시 필요하다. 어떤 내용을 담고 있는지, 간결하면서 직관적으로 작성할 필요가 있다. 2. 기능 설명 1번에서 간..

오늘 드디어 정상등록으로 RedTimer가 게시됐다. 개발과정의 설명을 적기에는 내용이 부족해서 CSS 카테고리에 타이머 생성과 관련된 부분만 게시할 예정이다. 초기 스토리보드 작성부분과 차이가 있지만 결과적으로 깔끔하고 간단한 디자인에 초점을 둬서 만들었다. 타이머에만 눈이 갈 수 있도록 했다. 색상 부분은 빨간색을 유지하면서 눈에 띄기는 하면서 눈이 아프지 않은 색을 고르느라 고민을 했던 것 같다. 약간의 꼼수로 Youtube가 선택한 색상을 나도 사용했는데, 괜히 유투브가 그 색을 고르지 않았을 것 같아서이다. 확실히 눈도 안아프고 눈에 들어오는 RedTimer가 완성될 수 있었다.

확장 프로그램을 만들어보고 싶다고 생각해서 단순하게 html 파일로 만들어서 크롬에서 확인하고 고쳤는데 이게 잘못된 방식이라는 것을 뒤늦게 알았다. 정확하게는 잘못됐다기보다 조금 느린 방식의 접근이었다. 1. 개발자 모드에서 개발 시작하자! 확장프로그램 개발을 위해서는 각각 웹사이트에서 ://extension으로 개발자모드로 들어가서 현재 상황을 확인하면서 할 수 있다. manifest.json 프로그램으로 사이드바앱인지 등 종류만 확정지어도 브라우저 너비 등등에 대해서 불필요하게 고민할 시간을 줄일 수 있다. 2. 확장프로그램에서 필요한 API를 확인하자. 웹에서 제공하고 있는 API가 다양한 것들이 있기 때문에 미리 확인하면서 개발단에 사용하면 개발시간을 줄일 수 있고 그냥 살펴보는 재미가 있다. 3..

01. 프로젝트의 주요기능(version 0.0.1) 사용자가 원하는 1~60분 내의 타이머 기능으로 설정한대로 시간을 측정, 기록할 수 있도록 했다. 02. 상세 기능 기본 세팅 타이머 부분의 모양을 화면시작시 보이게 하고, 초기 타이머 값은 15분으로 설정한다. 타이머 세팅 1) 0~60분에 원하는 시간을 입력 또는 input 숫자타입으로 up/down이 가능하게 한다. 2) 시간 변동에 따른 타이머 동작부분 반경의 변화 (실제 줄어들 빨간색 모양) 타이머 구동 1) 시작버튼 누르면, 타이머 동작부분과 input 숫자가 감소한다. 2) 멈춤버튼 누르면, 시작버튼으로 바뀌면서 interval을 clear처리한다. 3) 재시작버튼 누르면, 시작시 저장해두었던 세팅을 기억하고 그 시간만큼 타이머가 구동된다..

0. 왜 확장프로그램인가? 이전부터 만들어보고 싶기도 했고 이상하게도 내가 원하는 타이머가 확장프로그램으로 개발이 되지 않아서 만들어보고 싶었다. 돈주고 타이머를 구매할까 하다가 괜히 비주얼적인 요소가 부가된 타이머를 산다는 것이 돈이 아깝기도 했다. 어플은 있는데 왜 확장프로그램은 없는지 모르겠다. 아마 돈이 되지 않아서 그런 것 같다. 프로젝트 개발 의도는 어차피 돈이 아니므로! 타이머 체커가 필요한 나에게 필요한 기능을 만드는 것이 목표이다. 1. 개발환경 프론트 언어나 프로그램을 전문으로 배우지 않아서 백엔드까지 연결하는 프로젝트로 만드는 것이 목표이다. 그래서 일단 Intellij에서 Springboot gradle, Java 기반으로 JS, CSS, HTML을 사용했다. 욕심같아서 다른 언어나..

모듈을 인식하지 못하는 ModuleNotFoundError 에러가 발생했다. 왜일까..? 개발환경: Django, python 3.9, VS Code 고려해 본 사항들 1. 네이밍이 잘못된 경우 - 중복된 파일 이름이 있는지 확인해보자. 2. from 경로가 잘못 설정된 경우 - 상대경로가 아닌 절대경로로 확실한 import 위치 바로 잡기 3. setting.py INSTALLED_APP에 등록되지 않은 경우 - 모듈 등록하기 4. __init__.py 순서가 잘못된 경우 5. 캐시 지우기 6. path python 버전 확인하기 7. python app과 project 구조가 알맞게 되어있는지 확인하기 8. 빈 __init__.py가 app 내에 없어서 발생한 에러인지 확인하기 나의 경우는 다 해당하..

효율적인 루핑을 위한 이터레이터를 만드는 함수라고 한다. 여기서 루핑은 looping, 즉 반복을 의미한다. 이터레이터는 여러 요소를 포함하고 있어 하나씩 꺼내서 어떤 연산을 수행할 수 있도록 하는 객체를 말한다. 편리하게 반복자를 만드는데 사용되는 모듈이다. 파이썬 표준라이브러리 내용을 바탕으로 알아보면 다음과 같다. 무한 이터레이터 종류 - count(), cycle(), repeat() itertools.count( ) 표준 예제에서 보면, itertools 모듈의 count 함수는 다음과 같이 start 지점과 step 지점이 있고, 각각의 디폴트 값은 0, 1 임을 알 수 있다. start로 시작해서 step의 값만큼 값을 증가시켜 무한으로 반복하는 것을 알 수 있다. 최대값을 알 수 없는 상태..