티스토리

MOOB 개발 블로그

검색하기

블로그 홈

MOOB 개발 블로그

mber.tistory.com/m

개발 공부 하는 블로그 💻

구독자: 5

방명록 방문하기

주요 글 목록

2022년 상반기 회고 및 하반기 계획 우선 이 블로그를 아주 오랫동안 방치해 두었던 것에 대한 반성으로 시작한다. 회사 업무가 바쁘기도 했고, 개인적인 사정으로 인해 꽤 오랫동안 무기력과 우울에 빠져 지냈다. 그러나 이제 심리적으로 어느정도 안저이 찾아왔고 블로그도 다시 열심히 써 보고자 그간 있었던 일을 회고를 적어보고자 한다. 블로그 개발 블로그는 오랫동안 새 글을 쓰지 않았지만 매일 200명 정도의 꾸준한 유입이 있다. 아무래도 검색을 통한 유입이 가장 많았고, 개발 공부 초기에 적어둔 CSS 기초 및 JS 기초를 정리한 내용으로의 유입이 많았다. 덕분에 얼마전 2년만에 100달러 수익을 달성해서 이번 달에 에드센스 광고비를 입금 받을 것 같다. 다만 꾸준히 유입이 늘어나는 건 아니라 진짜 2년에 10만원 한 번씩 받을 듯 ㅋㅋㅋ… 한.. 공감수 3 댓글수 2 2022. 9. 7.
[CSS100DAYS :: DAY4] 인터렉티브 CSS 다루기 - transfrom을 이용하여 동심원 애니메이션 만들기 DAY2도 했는데 얘가 더 쉬워서 먼저 올린다. CSS 100 챌린지를 하면서 느낀 건 transfrom을 잘만 사용하면 어려워보이는 인터렉티브 동작도 생각보다 쉽게 구현할 수 있고, 그 애니메이션이란 게 대부분 반복적이다 보니 처음에만 잘 방향을 잡아두면 어렵지 않게 만들 수 있다. 가장 먼저 html 코드를 작성해준다. 지난번과 크게 다르지 않다. 이제 CSS로 기본적인 모양을 만들어주자. 배경색과 쉐이드가 있는 각각 크기가 다른 원 세 개를 만들어 준다. 여기서 infinite는 애니메이션을 무한으로 반복시켜 주는 것이고 alternate는 애니메이션을 순방향으로 진행시킨 다음 역방향으로 다시 진행시켜 주는 것을 말한다. 이렇게 하면 동심원이 펼쳐졌다가 다시 사그라드는 동작을 영원히 반복하게 된다... 공감수 0 댓글수 0 2022. 1. 21.
[django 기초] 장고의 model과 admin 다루기 model 데이터베이스에 저장될 테이블을 정의한다. 테이블은 models.py에서 정의되며 테이블을 하나의 클래스로 정의하고 테이블의 컬럼은 클레스의 변수(속성)으로 매핑한다. CharField() : 길이 지정이 필요한 문자열 IntegerField() : 정수형을 받을 수 있는 타입 TextField() : 길이 지정이 필요 없는 문자열 #출처 : 파이썬 페이스북 클론 (인프런) from django.db import models class Notice(models.Model): title = models.CharField(max_length=200) likedCount.= models.IntegerField() view = models.IntegerField() contents = models.Te.. 공감수 0 댓글수 0 2022. 1. 20.
[CSS100DAYS :: 2일차] CSS로 인터렉티브 웹 구현 - 햄버거 버튼 만들기 (transform 응용하기) 이 포스트는 100 Days of CSS 사이트의 예제를 직접 구현한 내용을 정리해 포스팅한 것입니다. 제가 아주 오랫동안 블로그를 쉬었고... 그래서 저도 제가 이걸 어떻게 만들었는지 조금도 기억나지 않아서 되새기는 김에 함께 구현 방법에 대해서 알아보도록 하겠습니다. 완성본은 다음과 같습니다. (제가 만들었지만 꽤 잘 만든 편 아닌가요?) 먼저 html 코드를 보겠습니다. 여기서는 CSS 내용이 더 중요하기 때문에 대략적인 모양을 갖출 수 있도록 구성했습니다. 기본적으로 세 개의 바 모양은 같기 때문에 효율적으로 스타일을 주기 위해 bar 클래스를 통일했고, 클릭했을 때의 애니메이션 동작이 세 개가 전부 다르기 때문에 one two three 세 개의 별개의 클래스를 주어 조절하도록 하겠습니다. 가장.. 공감수 1 댓글수 0 2022. 1. 19.
[react native] 리엑트 네이티브에 커스텀 폰트 넣는 방법 리엑트 네이티브를 배우기 시작하면서, 나도 FE 개발자라고 디자인은 내가 원래 하고싶었던 대로 바꾸면서 하고 있는데 아무래도 기본 폰트는... 진짜 쓰기 싫다. 적어도 구글 웹폰트정도는 사용할 수 있었으면 좋겠다는 생각에 알아본 내용을 정리한다. google 웹폰트 다운받기 리엑트 네이티브에서 사용하고자 하는 폰트를 다운로드 해야 합니다. 저는 앱의 header 에 적용할 볼드한 픈트를 사용하고 싶어서 Anton 폰트를 사용하기로 했습니다. Anton : https://fonts.google.com/specimen/Anton 뻘소린데, 저는 안톤 폰트를 진짜 좋아하는 것 같습니다. 딱히 이걸 선택하자는 마음이 없어도 꼭 강조 표시하는 문구는 전부 얘 쓰는 것 같아요. 우측의 select this styl.. 공감수 0 댓글수 1 2022. 1. 18.
[React 기초] 그래서 JSX가 뭔데? (정의와 기초 문법) 이 포스트는 노마드 코더의 ReactJS로 영화 웹 서비스 만들기 를 수강하고 추가적으로 각 개념에 대해 학습하여 정리한 내용입니다. JSX란? javascript 에 XML을 추가한 추가 확장 문법이다. React에 엘리먼트를 추가할 수 있게 해주며, 그 형태가 html 과 유사하여 FE개발자들의 편의를 도모한다. JSX 는 자바스크립트의 공식 문법이 아니다. 브라우저가 실행될 때 때 babel 을 통해 일반 자바스크립트 문법(React.createElement)형식으로 변환되어 실행된다. (즉, 바벨 설치가 선행되어야 한다.) React 개발에 있어 JSX 의 사용은 필수가 아니다. 다만 자바스크립트 코드 내에서 UI를 개발하는 데 직관성을 높여주는 효과가 있어 많이 사용된다. 지난 시간에 사용했던 .. 공감수 0 댓글수 0 2022. 1. 17.
[react 기초] 노마드 코더 강의 1 : 리엑트로 이벤트 만들기 이 포스트는 노마드 코더의 강의의 Events in React를 정리한 것입니다. 앨리먼트 생성하기 실제로는 잘 사용되지 않는 방법이지만 다음과 같이 새 앨리먼트를 생성할 수 있음. 보이는 것과 같이 id 또는 style 등의 프로퍼티 또는 텍스트를 넣어서 제작할 수 있다. const span = React.createElement("h3", {id:"first", style:{color:"red"}}, "hello world"); 뿐만 아니라 안에 이벤트를 넣어 생성하는 것도 가능하다. const button = React.createElement("button", { onClick: ()=>{ console.log("clicked") }, style:{ backgroundColor:"red" } },.. 공감수 0 댓글수 0 2022. 1. 16.
[django 기초] 장고의 기본 구조와 settings.py 확인 / superuser 생성하기 아주 오랜만에 장고에 대해 포스팅 해본다. 사실 그동안 나도 다까먹어서 새로 공부하는 중임. 이 내용은 제주코딩베이스캠프의 페이스북 클론 강의와 쉽고빠른 웹개발, 파이썬 웹 프로그래밍 책을 보고 정리하는 것이다. 장고에서의 뼈대는 중심이 되는 프로젝트와 그 곁가지를 형성하는 애플리케이션으로 이루어져 있다. 장고 프로젝트를 처음 설치하면 자동적으로 db.sqlite3 데이터베이스가 설치된다. 프로젝트 생성 django-admin startproject {프로젝트이름} . 애플리케이션 생성 python manage.py startapp {애플리케이션 이름} 장고의 큰 틀은 이 두가지로 이루어져 있습니다. 제일 먼저 프로젝트 폴더에 있는 [settings.py](http://settings.py) 폴더를 살펴.. 공감수 0 댓글수 0 2022. 1. 15.
[react native] 날씨앱 만들기 정리 처음으로 리엑트 네이티브를 공부하기 시작한 것은... 사실은 한 번쯤 스토어에 내 어플을 올려보고 싶다는 생각을 해서 처음엔 스위프트&flutter 강의를 결제 했었다. 그런데 과연 프론트엔드 개발자로서 갑자기 다른 언어를 배워서 써먹겠다고 이 중요한 시기에 js 말고 다른 언어를 배우는 것이 맞을까? 그게 과연 효율적일까? 라는 생각이 자꾸만 들었다. 게다가 왠지 업무 개발을 할 때에도 괜히 그 언어로 썼던 습관 때문에 자꾸 헛손질을 하게 되는 것 같은 느낌이 들어서 이왕 배우는 거 react-native를 통해 자바스크립트 문법을 이용한 개발을 배워보고자 했다. 리엑트에는 많은 장점이 있는데 그 중 하나는 IOS와 안드로이드 개발이 동시에 가능하다는 것이고 또 하나는 커뮤니티가 굉장히 크고 잘 되어 .. 공감수 0 댓글수 0 2022. 1. 14.
FE개발자의 정신없이 지나간 2021년 회고 잘가라, 2021! 이제와서 회고를 쓰는게 꽤 부끄럽긴 하지만, 정말 2020년에 뭘 했는지 모르겠어서 회고를 쓸 마음이 전혀 들지 않았다. 대체 내가 뭘 했지? 2020년 진짜 아무것도 안하고 보낸 것 같은데? 라는 생각밖에 들지 않았지만 회고는 어차피 1년에 한 번 아니면 반기에 한 번 밖에 쓸 기회가 없는 글이니 한 번 써보기로 했다. 개발 외 다른 것에 집중한 해. 1월. 코로나로 인해 엄청난 주식 상승장이 있었고 개발보다는 주식 및 경제 공부하는데 더 열을 올렸던 것 같다. 개발을 해야지! 라는 마음은 있는데 내가 사는 지역은 커뮤니티나 스터디가 활발하지 않아서 토이 프로젝트도 거의 무조건 혼자서 해야 하고 회사에서도 별로 재밌는 프로젝트를 하지 않아서 많이 방황했던 시기였다. 특히 인사평가 때.. 공감수 0 댓글수 0 2022. 1. 13.
[프로그래머스] 직사각형 별찍기 (python/javascript) avascript process.stdin.setEncoding('utf8'); process.stdin.on('data', data => { const n = data.split(" "); const a = Number(n[0]), b = Number(n[1]); for(let i=0; i < b; i++){ let star = '' for(let j=0; j 공감수 0 댓글수 0 2022. 1. 12.
[백준 15554번][python/javascript] 빠른 A+B python sys.stdin.readline() 사용 안하면 시간 초과 될 수 있다. 처음 알았음. import sys number = int(input()) for i in range(number): a,b = map(int, sys.stdin.readline().split()) print(a+b) javascript 자바스크립트의 경우 별 다를 것 없었다... let input = require('fs').readFileSync('/dev/stdin').toString().split('\n'); let max = Number(input[0]); let answer = ''; for (let i = 1; i 공감수 0 댓글수 0 2022. 1. 11.
[javascript] 프로그래머스 - 부족한 금액 계산하기 문제 새로 생긴 놀이기구는 인기가 매우 많아 줄이 끊이질 않습니다. 이 놀이기구의 원래 이용료는 price원 인데, 놀이기구를 N 번 째 이용한다면 원래 이용료의 N배를 받기로 하였습니다. 즉, 처음 이용료가 100이었다면 2번째에는 200, 3번째에는 300으로 요금이 인상됩니다. 놀이기구를 count번 타게 되면 현재 자신이 가지고 있는 금액에서 얼마가 모자라는지를 return 하도록 solution 함수를 완성하세요. 단, 금액이 부족하지 않으면 0을 return 하세요. function solution(price, money, count) { let answer = 0; let total = 0 for(let i = 1; i < count+1; i++){ total += price*i; } ans.. 공감수 0 댓글수 0 2021. 8. 8.
[django 튜토리얼] 장고 설치하기 django는 파이썬을 기반으로 만들어진 백엔드 서버 프레임워크 입니다. 파이썬 설치 가장 먼저 파이썬 3.x 버전이 필요합니다. 만약 여러분이 맥 OS X 환경을 사용하고 계시다면 파이썬이 이미 설치되어 있을 것입니다. 파이썬 버전 확인하기 python --version 또는 python3 --version 파이썬 3가 설치되어 있지 않으시다면 다음 공식 사이트를 활용하여 파이썬을 먼저 다운받아 주세요. Download Python | Python.org 파이썬 3이 설치가 완료되셨다면 우리는 가상환경을 사용해 줄 겁니다. 장고 설치하기 먼저 장고를 설치할 위치를 잡아주신 후 가상환경을 설치하도록 하겠습니다. 장고를 설치할 폴더로 가셔서 다음 명령어를 작성해 줍니다. python3 -m venv myv.. 공감수 0 댓글수 0 2021. 7. 29.
[javascript 기초] 리스트에 새 요소 추가/삭제 (push, concat 등) 다음과 같은 리스트가 있다고 했을 때 const items = ["one", "two", "three"] 리스트에 새로운 아이템을 집어넣는 방법들 items[3] = "four"; //정해진 위치에 넣는 방법 items.push("four") //리스트의 마지막에 들어가게 된다. concat() : 리스트 더하기 만약 리스트에 리스트를 추가하고 싶다면 어떻게 하면 될까요? const ar1 = [1, 2, 3]; const ar2 = [4, 5, 6]; const ar3 = ar1.concat(ar2); 리스트에서 아이템을 삭제하는 법 splice() : 특정 위치의 요소를 삭제한다 const array = ["a", "b", "c"]; const index = 1; array.splice(index, .. 공감수 0 댓글수 0 2021. 7. 21.
[CSS] position: absolute인 아이템 가운데 정렬하기 오늘은 CSS를 통해 아이템 가운데 정렬을 하는 방법에 대해 알아보려고 합니다. 만약 당신이 다음과 같은 방법을 통해 가운데 정렬을 하려다 애를 먹은 경험이 있다면, 이 포스팅이 도움이 될 수도 있습니다. .item { position: absolute top: 50%; left: 50%; } 만약 위와 같은 방법으로 아이템을 가운데 정렬 하려고 했을 경우 아이템이 딱 가운데 정렬이 되지 않고 뭔가 애매하게 오른쪽 대각선 아래로 밀려나 있는 것을 볼 수 있을 겁니다. 왜냐하면 50%씩 밀려나는 기준이 아이템의 왼쪽 위이기 때문입니다. 그러므로 해당 아이템의 높이 및 너비의 절반만큼을 더 이동한 것 처럼 보이게 됩니다. 그러면 해당 아이템을 진짜 가운데 정렬 하기 위한 방법을 알아보겠습니다. 제가 가장 많.. 공감수 1 댓글수 0 2021. 7. 20.
[Canvas 공부 2일차] 이미지 업로드 이미지 불러오기 코드 void ctx.drawImage(image, dx, dy); void ctx.drawImage(image, dx, dy, dWidth, dHeight); void ctx.drawImage(image, sx, sy, sWidth, sHeight, dx, dy, dWidth, dHeight); // sx, sy는 소스의 x,y 이미지 불러오기 예제 기본적으로 이미지를 불러오는 방법은 다음과 같다. const canvas = document.getElementById("board_canvas"); const context = canvas.getContext("2d"); const imageElem = new Image(); imageElem.src = "src/img/medb.jpg";.. 공감수 0 댓글수 0 2020. 12. 7.
[HTML5/Canvas] Canvas 공부 1일차 : x축 기본 애니메이션까지 Canvas Day1 Canvas란 Canvas는 HTML5에서 새로 추가된 태그 중 하나로, 페이지에 그래픽 요소를 추가할 때 주로 사용된다. 기본적으로 width, height 속성을 가지고 있는데 이는 레이아웃이 랜더링되어 있기 때문에 CSS로 임의로 크기를 지정할 경우 화면이 왜곡되어 보일 수 있어 비율을 맞춰주어야 한다. 아래 두개의 canvas는 겉으로 보기에는 같은 크기이나 실제 화면에 이미지를 그렸을 때 차이가 난다. Canvas는 일반적인 이미지 속성과 같이 margin, border 등을 줄 수 있지만 실제 캔버스에 그리는 그림에는 영향을 미치지 않는다. 기본적인 사각형 그리기 var canvas = document.getElementById("board_canvas"); var ctx.. 공감수 1 댓글수 0 2020. 12. 6.
[생존신고] 번역 하나 했다.. developer.mozilla.org/ko/docs/Web/HTML/Canvas/Tutorial/Advanced_animations발전된 애니메이션우리는 애니메이션 공부를 위해 공을 사용할 것이다. 먼저 캔버스에 공을 그려보자. 다음 코드를 통해 준비해보자.developer.mozilla.org언제까지 공부 안하고 살거니...아무튼 요즘 Canvas에 관심 갖게 되어서 번역 하나 했다. 이거 마지막 예시 번역 하니까 안되던데... 일본어? 가 같은 현상 있는데 이유를 모르겠음 공감수 0 댓글수 0 2020. 12. 5.
[css] display:block과 visibility:none의 차이 css의 기능을 사용하여 화면의 어떤 요소를 화면상에 보이지 않게 할 때 보통 display:none를 사용한다. 비슷한 기능으로 visibility:hidden이 있는데 종종 이 두개의 차이점을 묻는 질문을 면접에서 물어볼 때가 있다. 이 두개의 차이는 무엇일까? 먼저 display:inline나 display:block속성을 사용해 보았다면 알겠지만 display는 어떤 요소의 속성 자체를 변화시킨다. 다음은 div{width:200px;height:200px;}를 준 이다. div는 디폴트로 display:block 속성이기 때문에 너비와 높이를 줄 수 있다. 다음과 같은 div 세 개가 나란히 있다고 했을 때 가운데 div에만 display:none을 줘보자. 여기에 display:inline을 .. 공감수 1 댓글수 0 2020. 8. 1.
[javascript]자바스크립트 리스트 reverse / 기존 array에 영향을 미치지 않게 하려면? 자바스크립트의 reverse() 기능을 알아봅시다. const arrayOne = ['a', 'b', 'c'] const arrayTwo = arrayOne.reverse() console.log(arrayTwo) //['c', 'b', 'a'] 다른 언어와 마찬가지로, 자바스크립트도 아주 쉽게 reverse() 를 통해 리스트를 역으로 만드는 게 가능합니다. 그런데, 여기서 주의할 점이 있습니다. 요 Array.prototype.reverse() 는 기존 리스트에게 영향을 줍니다. 즉, arrayTwo를 만들어도 arrayOne도 리버스 되어 있다는 소리입니다. 기존 리스트에 영향을 주지 않고 reverse하는 몇가지 방법 slice 사용하기 const arrayOne = ['a', 'b', 'c'];.. 공감수 0 댓글수 0 2020. 7. 28.
[프론트엔드 개발자 면접 문제 02] 인라인 요소와 블록 요소 HTML의 태그에는 인라인 요소와 블록 요소로 이루어져 있습니다. 이것에 대해 제대로 숙지하지 않으면 CSS가 제대로 먹히지 않습니다. 하지만 이것보다 더 큰 문제는 각 요소를 제대로 파악하지 않으면 HTML의 문서 흐름을 방해하고... 만약 면접관이 직접 만들어보라고 했을 때 인라인 요소 안애 블록 요소를 넣는다? 당신의 면접에 아주 악영향을 줄 것입니다... 블록요소와 인라인 요소를 구분하자면 다음과 같습니다. 블록요소 1. 줄 바꿈이 일어남. 2. 블록 요소 안에는 텍스트와 인라인 요소를 포함할 수 있음 3. 블록 요소 안에 또 다른 블록 요소를 포함할 수 있음 블록요소의 종류 address,article,aside,audio,blockquote,canvas,dd,div,dl, fieldset,fi.. 공감수 0 댓글수 0 2020. 6. 28.
[vue.js 기초] 뷰에서의 데이터 바인딩 / 이벤트 처리하기 Vue.js는 렌더링 된 DOM을 기본 Vue 인스턴스의 데이터에 선언적으로 바인딩 할 수있는 HTML 기반 템플릿 구문을 사용한다. 뷰에서의 템플릿 문법은 데이터 바인딩과 디렉티브로 나뉜다. 데이터 바인딩 new Vue({ data: { message: '안녕하세요' } }) {{ message }} 디렉티브 디렉티브는 v-접두사를 사용하는 속성들을 말한다. v-for v-if v-bind v-on v-model new Vue({ data: { items: ['red', 'blue', 'green'] } }) {{ item }} v-bind 이미지 데이터 연결 : v-bind:src 링크를 통한 연결 : v-bind:href 스타일시트 연결 : v-bind:class, v-bind:style 키를 통한.. 공감수 2 댓글수 0 2020. 4. 29.
[vue.js 기초] 폼 입력 바인딩 v-model 사용하기 / 한글 문제점 해결 vue의 form 입력 v-model은 input과 textarea에 양방향 데이터 바인딩을 가능하게 한다. 단 , v-model은 form 엘리먼트의 초기 value값을 무시하므로 컴포넌트 데이터 안에 초기값을 선언해줘야 한다. 메시지: {{ message }} new Vue({ el: '#app', data: { message: '' } }); 자세한 예제는 기술문서에 나와있으므로 참고 폼 입력 바인딩 — Vue.js Vue.js - 프로그레시브 자바스크립트 프레임워크 kr.vuejs.org 한글 실시간 반영 안되는 문제점 원래 이 속성을 사용하면 메세지가 실시간 반영되도록 할 수 있지만, 중국어, 일본어, 한국어는 특성상 한 글자 느리게 반영된다. 그래서 input 속성으로 사용해 주어야 함. 메시.. 공감수 0 댓글수 0 2020. 4. 28.
[vue.js 기초] 뷰 인스턴스(vue instance) vue 인스턴스 뷰 인스턴스는 뷰로 화면을 개발하기 위해 필수적으로 생성해야 할 기본 단위이다. 각 뷰 인스턴스는 데이터 객체 안에 있는 모든 속성을 프록시 처리한다.(데이터 변경시 자동으로 DOM을 업데이트함) var vm = new Vue({ //인스턴스에서 사용 가능한 속성과 api들 el: , // DOM의 시작점 template: , // 화면에 표시되는 요소 data: , // 데이터 속성 methods: , // 로직 제어 created: , // 라이프 사이클 관련된 속성 watch: , // data 변경 시 추가 동작을 수행할 수 있도록 함 }); $data // 1. 대이터 객체 생성 var data = {a : 1} // 2. 뷰 인스턴스에 데이터 객체 추가 var vm = new .. 공감수 0 댓글수 0 2020. 4. 28.
[JS] MVC 패턴과 MVVM 패턴 MVC 패턴 (이 패턴은 자바스크립트 고유의 것이 아닙니다.) MVC는 Model, View, Controller의 약자입니다. 응용 프로그램을 세가지 구성 요소로 나눈 것입니다. 이렇게 나누는 이유는 영역간 코드의 결합도를 최소화 시키기 위해서 입니다. 위 이미지 처럼 Model, View, Controller가 상호작용을 하며 사용자가 어플리케이션과 상호작용 할 수 있도록 만들어 줍니다. Model 모델은 데이터베이스에 있는 데이터를 가져와 다른 객체에 전달해 줍니다. 또는 외부 객체로부터 데이터를 받아서 DB에 넣어줍니다. View 모델에서 받아온 데이터로 화면을 관리합니다. 사용자가 입력한 데이터를 처리하고, 유저가 생성한 입력 이벤트 데이터를 다른 객체에 전달하는 역할을 합니다. (html, c.. 공감수 0 댓글수 0 2020. 4. 26.
[python/nodejs] 5543번 상근날드 1. python burger = [] drink = [] for i in range(3): a = int(input()) burger.append(a) for i in range(2): b = int(input()) drink.append(b) setmenu = min(burger) + min(drink) - 50 print(setmenu) 2. nodejs et fs = require('fs'); let input = fs.readFileSync('/dev/stdin').toString().split('\n'); let cost = []; input.forEach(function(value) { cost.push(Number(value)); }); let burger = []; for (let i =.. 공감수 0 댓글수 0 2020. 4. 25.
[python/nodejs] 10039번 평균점수 1. python sum = 0 for i in range(5): score = int(input()) if score < 40: score = 40 sum += score print(int(sum/5)) 2. nodejs let fs = require('fs'); let input = fs.readFileSync('/dev/stdin').toString().split('\n'); let sum = 0; for (let i = 0; i < 5; i++) { if (input[i] < 40) { input[i] = 40; } sum += Number(input[i]); } let result = Math.floor(sum / 5); console.log(result); 배운 점 : javascript에서는.. 공감수 0 댓글수 0 2020. 4. 25.
[프론트앤드 개발자 면접질문 모음] 01. window 객체란 무엇일까? 안녕하세요. 제가 블로그 포스팅을 하는 것 중에 프론트앤드 개발자 면접질문 모음이라는 포스팅이 언제나 가장 많은 조회수를 차지하고 있더라고요. 🤔그런데 그 포스팅이 진짜 면접 때 빠르게 훑어보고 외우기 위해 정리한 것이다 보니 막상 이 포스팅을 보고 면접 전에 빡세게 준비하려는 분들께는 큰 도움이 되지 않을지도 모르겠다는 불안감이 문득 들어 개인적인 회고 겸 해당 포스트에서 작성한 대답들을 최대한 자세히! 공부하는 심정으로! 정리해 보려고 합니다. 만약 다른 질문들을 구글에서 본다면 그 질문에 대해 추가할 예정입니다. 먼제 가장 먼저 window 객체가 무엇일까요?에 대해 알아보도록 하겠습니다. window 객체를 한 마디로 표현하면, 브라우저 객체 모델(BOM)의 핵심이자 브라우저의 인스턴스입니다. 앗.. 공감수 0 댓글수 0 2020. 4. 24.
[python/nodejs] 백준 알고리즘 14681번 1. python a = int(input()) b = int(input()) if(a > 0): if(b > 0): print(1) else: print(4) else: if(b > 0): print(2) else: print(3) 인터넷 돌아다니다가 이 해법을 봤는데 진심 천재;;; 왜 이러시는진 모르겠지만 대단하네요... print("3421"[(int(input())>0)+(int(input())>0)*2]) 2. nodejs 여러줄 입력할 때랑 한 줄 입력할 때랑 입력 세팅이 다름... ㅋ... const readline = require('readline'); const rl = readline.createInterface({ input: process.stdin, output: process.. 공감수 0 댓글수 0 2020. 4. 24.

문의안내

티스토리
로그인
고객센터

티스토리는 카카오에서 사랑을 담아 만듭니다.