전체 글 142

단 20줄로 만들어보는 로또번호 생성기! 소스 코드

로또 번호 생성 프로그램~ 광고 등을 통해 많이 보셨죠? 오늘은 로또 번호 생성 코드를 만들어보려고 합니다. 저는 javascript / html/ css를 사용해서 만들었어요 우선 HTML 코드입니다 번호 받기 number클래스로 지정된 div들이 7개의 로또 구슬이 될 거구요, 버튼을 클릭하면 이 구슬들에 랜덤으로 번호가 나타납니다. Javascript코드는 이렇게 될거에요~ button의 onclick이벤트 함수 안에서 구슬 엘리먼트 (number)들 안에 숫자를 표시해 주는 로직입니다. let element = document.getElementById("button"); element.onclick = () => { let result = []; while(1) { var num = parseI..

Frontend/Javascript 2022.11.07

HTML/CSS UL, OL을 사용해 보자

HTML/CSS UL, OL HTML에서 리스트를 작성하기 위해 사용되는 태그들이 있다. 바로 UL / OL / DL등이 그것인데, 각각 다음과 같은 의미를 가지고 있다. Unordered List (정렬되지 않은 목록) Ordered List (정렬된 목록) Description/Defined List (서술(정의) 목록) Unordered List는 목록이 다음과 같이 보여진다. 목록은 태그 안에 정해주어야 한다. List 1 List 2 List 3 List 1 List 2 List 3 만약 CSS 속성의 list-style-type 항목을 circle로 설정해 주면 이렇게 보인다. List 1 List 2 List 3 CSS를 사용해서 원하는 모양으로 바꾸어 주면 되고, 만약 원하지 않으면 해당 ..

Frontend/HTML 2022.11.04

[HTML / CSS] 색상 완벽 정리!

CSS에서 색상 표기법은 여러 가지가 있다. 다음과 같이 배경색을 지정했다고 했을 때, 배경은 무슨 색이 나올까? 1. background: #ff0000; 2. background: #F00; 3. background: rgb(255, 0, 0); 4. background: red; 5. background: rgba(255, 0, 0, 1); 6. background: rgba(255, 0, 0, 100%); 7. background: rgba(255 0 0 / 1); 8. background: rgba(255 0 0 / 100%); 정답은 모두 빨강 이다. rgb의 값은 Red (빨강), Green(초록), Blue(파랑) 이렇게 세 가지로 구성되어 있는데, 이는 16진수 헥사코드에서도 동일한 구성..

Frontend/HTML 2022.11.03

Strict equality === (동치 연산자)

자바스크립트를 처음 시작할 때 다른 언어에는 없어서 헷갈렸던 "===" 이건 도대체 뭘까요? 보통 C언어나 Java에서는 보이지 않는 "==="는 생각보다 단순한 개념을 가지고 있습니다. 예제를 한번 볼까요? 다음 중 어떤 것이 거짓일까요? 10 == "10" 0 == false 1 == true 1 == 1 "apple" == "apple" null == undefined 네, 모두 참(True) 입니다. 타입을 엄격하게 지정하는 Java나 c와는 달리, 자바스크립트에서는 var / let/ const등을 통해 모든 타입의 변수를 선언합니다. 그래서 자바스크립트에서는 "===", "!==" 를 사용하는 것을 권장합니다. 그런 경우 위의 케이스에서 대부분의 비교문들이 거짓(False)이 되겠죠? "===..

Frontend/Javascript 2022.10.11

let 과 var의 차이점? 어떤 걸 사용해야 할까요? 🤷‍♀️

안녕하세요, 쁘띠 코딩입니다. C나 Java등과는 다르게 자바스크립트의 경우에는 var 또는 let 을 이용해 다양한 타입의 변수를 선언할 수 있습니다. 그런데 이 변수들은 어떤 차이가 있을까요? 오늘은 자바스크립트 변수 타입에 대해 한번 알아보겠습니다. var는 function scoped 변수입니다. 즉 주어진 함수 내에서 사용할 수 있는 변수를 의미하는데요, 다음과 같은 함수가 있을 때, 이 함수 내에서 해당 변수를 호출하면 그 위치가 어디가 되었든 오류 없이 변수에 엑세스가 가능합니다. const functionScopedExample = () => { valueA = 5; console.log("value A: ", valueA); var valueA = 6; console.log("value ..

Frontend/Javascript 2022.10.10

무조건 합격하는 영어면접 준비하기 - 마무리

4. 연봉 협상 4.1 환율, 세금을 고려해서 내가 받을 연봉 정하기 해외 취업은 우리나라에서 취업하는것과 연봉 체계도 다르고 내야할 세금도 다르다. 연봉협상을 할 때에는 어떤 방식으로 급여를 주는지 미리 파악하고 환율과 세금을 고려해서 내가 받아야 하는 금액을 산정해 놓고 면접에 임하는 것이 중요하다. 4.2 큰 수의 단위는 영어로 어떻게 표현하는지 미리 계산하기 가뜩이나 환율이 다른 것도 헷갈리는데, 큰 수의 단위까지 모르면 연봉 협상시 더 큰 혼란을 초래할 수 있다. 1Million USD = 약 13억원, 1Billon USD = 약 1조 3천억원 등 큰 금액에 대해 원화로 얼마나 되는지 미리 파악을 해 놓는다. 면접을 보고자 하는 회사가 이번에 3Million원을 투자받았습니다. 라고 말한다면 ..

무조건 합격하는 영어면접 준비하기 - 3 여기부터 진짜 꿀팁

3. 영어..정말 괜찮겠어? 영어 면접이 1주일 뒤로 잡힌 날, 은수 씨는 발등에 불이 떨어졌다. 발음이야 그렇다 치고, 상대방의 말을 잘 알아들을수 있을지가 가장 큰 문제였다. 아무리 훌륭한 대답을 가지고 있어도 면접관의 질문을 알아듣지 못한다면 큰 문제가 아닐까? 결국 은수 씨가 1주일동안 주구장창 했던 일은 “쉴 새 없이 팟캐스트 듣기" 였다. 계속 흘려듣는 거다. 특히 은수씨의 분야인 개발에 관련된 팟캐스트를 많이 들었다. 전문 용어에 익숙해 지기 위해서라는 이유도 있었다. 3.1 영어실력 단기간에 끌어올리기 시간이 많다면 미리 준비하면 좋겠지만 시간이 없는 사람은 은수 씨가 했던 방법을 추천한다. 유튜브로 흘려듣기를 하는 것도 좋다. 다만 팟캐스트의 경우에는 이어폰만 끼고 다른 일을 하며 들을 ..

무조건 합격하는 영어 면접 준비하기 - 2

2. 어떤 자세로 인터뷰에 임해야 하는가? 2.1 첫째도, 둘째도, 셋째도 자신감 자신감이 없는 사람은 본인 뿐 아니라 상대방도 대화를 통해 단번에 이를 느끼게 된다. 영어 면접의 경우 특히 더 그렇다. 한국은 자신감이 있는 사람을 보며 너무 나댄다, 잘난척한다 라고 생각하는 경향이 있는데 외국인들과 일해본 경험으로 외국인들은 자신감이 넘쳐난다. 자신이 하고 있는 일에 대한 자신감이 있고 절대 주눅들지 않는다. 심지어 영어 발음이 최악인데도 그 자신감이 어디서 나오는 건지, 신기할 때가 많았다. (사실 영어 발음은 한국인이 가장 많이 신경쓰는 경향이 있다.) 면접을 볼때에도 그렇다. 내 영어 발음을 저 사람이 알아들을까, 문법이 틀리지는 않을까 전전긍긍하고 고민할 필요는 없다. 이미 굳어진 영어 발음을 ..

반응형