본문 바로가기

전체 글

 (188)
웹 개발자로서 걸어야 할 길에 대한 고찰 웹개발자로서 흥미를 느껴 공부를 하면서 취업에 대해 생각하게되었다. 전역후 약 3달 즉, 100일 정도가 지났다. 파이썬으로 코딩테스트를 준비했고 자료구조와 알고리즘을 같이 공부했으며 웹 개발자의 기본 덕목인 html, css를 공부했다. 흔히 말하는 네카라쿠배를 가고싶었다. 네이버, 카카오, 라인, 쿠팡, 배달의민족 하지만 파이썬으로 웹개발을 하는 신입으로서 가기에는 모두다 java를 원했다. 굳이 대기업을 가야 하느냐 라는 말에서는 스스로 의문을 느끼지만 중소기업에서의 성장조건을 대기업은 모두 갖추고 있을 뿐만 아니라 좋은 환경과 연봉에서 성장할 수 있고 경력과 인맥또한 더 갖추고 있어 시작을 하기에는 꿈의 직장이라고 할만 했다. 고로 배달의 민족의 우아한 테크코스 라는 곳에 지원을 하기로 마음먹었다..
HTML\CSS Tip - 3[CSS - uppercase ] 1. CSS - uppercase text-transform: uppercase - 해당 element의 글자를 모두 대문자로 만들어준다. - 소문자나 대문자나 둘다 허용 2. 부분 지정 class - 코드 상에 다른 divider가 있을 수 있는데 open-post__members 라는 클래스가 지정된 element안에 있는 divider만 지정된다. 3. 같은 코드를 찾아서 수정하고 싶다면? alt + 클릭을 통해서 같은 부분을 지정하는 것도 있지만 같은 부분을 드래그해서 마크한다음 ctrl + D 를 여러번 눌러서 수정하고 싶은 부분을 한번에 마크할 수 있다. 4. 양옆을 자연스럽게 center로 margin을 놓고 싶다면? margin : auto 를 사용하자 5. boxsizing - boxsi..
충남 아산여행 계획 - [2020. 10. 01 ~ 03] 10월 1일 13시 집 출발 14시 사랑쓰 숙소 도착 태우고 아산 모나무르 출발 16시 반 모나무르 도착 모나무르 전시회 - 무료 - 유영운 초대전 - 아름다운 배경 www.monamour.kr/sub3.php?Page=sub3-1-1 복합문화공간 아산 모나무르 빛과 소리 그리고 자연의 아름다움을 추구하는 모나무르, 공연, 카페, 레스토랑, 웨딩홀 운영, 충남 아산시 위치 www.monamour.kr 모나무르 레스토랑 m.blog.naver.com/PostView.nhn?blogId=a3133aa&logNo=221692699505&proxyReferer=https:%2F%2Fwww.google.com%2F - 메뉴 2개 : 2.5만원 - breaktime : 15시 ~ 17시 [아산가볼만한곳] 모나무르 ..
HTML\CSS Tip - 2[Center에 놓이는 기술, Reset CSS, ColorZilla, page Ruler redux, :not[()] ] 1. Centering 여러 컨테이너들이 놓여있을때 서로의 크기 때문에 justify-content: space between으로 해도 정확하게 중간으로 가게하지 못한다. 얼추 비슷하게는 되지만 말이다. 이때 여러 컨테이너들 중 딱 한개의 요소가 정중앙에 있게 하는 기술이있다. 위와 같이 중앙 정렬이 잘안될 때는 모든 요소 width: 33%를 맞추고 해당하는 부분만 다시 중앙정렬을 해주면 완벽히 중앙에 해당요소가 간다. 시계가 갔다. 2. Reset CSS - 브라우저에 의해 기본적으로 적용되는 margin이나 기타 공백들을 없애고 - 아얘 깔끔히 모든 값이 0인 상태에서 시작하고 싶을 떄 사용한다. 구글링을 통해 파일을 찾아낸다음. meyerweb.com/eric/tools/css/reset/ CSS..
HTML\CSS Tip - 1 [코드 단축어, 아이콘사이트, index.html, fontawesome, heroicons, googlefont] index.html 대부분의 웹서버가 default로 index.html 이라는 파일을 찾아보도록 설정되어 있다. 영어에서는 index라는 말은 첫번째 라는 의미를 갖고 있으므로 visual studio html TIP 1. 기본 html 형식 - ! 누르고 난후 엔터 아래와 같이 예쁜 html파일이 찍히게 된다. link:css - 단축키로서 이후 엔터를 누르면 이렇게 바로 설정이되고, css폴더 아래에 style.css파일을 만든경우이므로 이렇게 수정만 하면 css파일과 html파일이 연동이 되었다. 계단식 html 구조를 쉽게 만들자 tag>tag>tag*숫자>tag -> a a .. .class이름>tag.class이름*숫자 2. drag image in screen 이렇게 이미지와 코드(코드와 ..
.gitignore 파일 (git이 인식을 안했으면 하는 파일 데스노트) .gitignore 이라는 파일은 자신이 무시하고 싶은 파일이름을 담으면 git이 해당 파일을 무시한다. -> root 디렉토리 내에서 screenshot 이라는 폴더를 무시하고 싶어 .gitignore 파일을 만들면 아주 약하게 screenshot이라는 폴더의 이름이 연하게 변한다. 지우면 원래대로 돌아간다. git bash에서 git add . git commit git push를 해준다음 그외 gitignore이 안먹힐 때는 #1. config 디렉토리 무시 git rm --cached config/ -r #2. db_conn.php 파일 무시 git rm --cached db_conn.php #3. sql 확장자 무시 git rm --cached *.sql github을 들어가봐도 screensh..
CSS - 10 [media query] media query - 웹브라우저는 다양한 화면에서 실행될 수 있다. 휴대폰, 태블릿, 대화면 tv, 모니터등 다양한 화면에 맞춰 css는 화면 비율을 맞추고 바꾸고 화면을 감지 할 수 있다. - 화면을 감지하여 해당하는 화면비율로 웹브라우저를 맞춰주는 것이 media query이다. @media screen and (max-width: 400px){ } 위구문 전체가 의미하는것은 '이 스크린이 400px보다 작으면 아래를 실행 하라' 물론 @media screen and (max-width: 400px) and (max-width: 650px) ... { } 와 같이 다양한 조건을 넣을 수도 있다. 스크린의 크기를 줄였더니 적용이된다. 또한 웹브라우저로 다양한 타입의 화면으로 브라우저를 봤을 때 어떤..
CSS - 9 [animation, Animista] animation transform과는 다르게 어떠한 움직임으로 상태를 변화시키켜 애니메이션을 만드는 것말고 그냥 화면에 자동으로 애니메이션이 동작하는 경우 @keyframes 애니메이션이름{ from{ transform: } to{ transform: } } tag { animation: 애니메이션이름 시간 ease-in function } - from 부터 to까지 움직이는 animation을 만들고 싶다. 이제는 애니메이션의 스탭을 줘보자 : 상태를 여러 형태로 바꾸면서 이어지게 하자 위와 같이 여러 단계별로 나누어서 상태를 변화 시킬수 있다. 단계는 1% 2% 등 0~ 100%까지 나눌수 있다. 무조건 애니메이션을 transform으로만 만들라는 것은 아니다. border-radius: 50%등 ..

티스토리툴바