면접 전후로 궁금해서 검색을 많이 해봤는데 생각보다 후기나 진행과정에 대한 글이 많이 없어서 나라도 써볼까.. 하는 생각으로 후기를 작성해본다.  내가 다른분 글을 읽고 도움받은것 처럼 누군가는 내가 쓴 글을 읽고 도움받았으면 좋겠다.

 

2주동안 주 5일 강의를 듣고 매일 2차 시험을 봤다.

밤11시에 시작해서 30분동안 시험을 보았고, 마지막날은 1시간동안 시험을 치는 것이었다.

 

첫 1주일동안은 파이썬을 배웠고, 그 다음 1주일동안은 자료구조를 배우며 파이썬으로 코드까지 만들어보는 코스였다.

강의 시간만 보면 2시간 내외였는데, 파이썬도 처음이고, 자료구조를 제대로 공부하는것도 처음이라서 공부하는데는 시간이 더 걸렸다.

매일 푸는 문제는 이론을 객관식으로 묻는 문제도 있고, 코드를 작성하는 문제도 있었다.

풀수있었던 날도 있었고 안풀려서 나는 바보멍청이인가.. 하다가 풀리는 문제도 있었다.(물론 안풀리는 것도 있었다..)

2주동안 본 시험을 합산해서 2차시험 합격여부가 결정된다고 했는데, 점수를 알려주는것은 아니어서 매일 떨리는 마음으로 시험을봤다.

일단 끝까지 가보자는 생각으로 공부를 했는데 다행히 2차테스트에는 합격했다..!

 

그리고 최종면접 의사를 묻는 메일을 받았고, 회신을 하니 면접 일정을 잡아주셨다.

면접은 Google meet으로 진행되었다. 

시간에 맞춰 링크로 들어가니, 바로 면접관님과 1:1로 면접을 보게되었다. 

기술보다는 인성면접을 위주로 보시겠다고 말씀하셨고, 그렇게 진행되었다.

 네카라쿠배 교육 과정 블로그 여기에 신입개발자 면접 예상질문들이 있는데 좀 비슷한 느낌!

 

떨려서 끝나고 생각해보니 그 질문은 이런 의도였을까? 생각이 들곤 하지만 그래도 열심히 대답해서 미련은 없는 것 같다.

월요일에 발표가 나고 만약 합격한다면 7월 12일부터 수업이 시작된다고 하는데 어떤 결과가 나올런지..🥶

 

 

한 분이 1기 면접후기 작성하신것을 읽어보니, 1기선발때는  1차 시험때 수학개념 문제도 봤던것 같고 기술면접도 봤던것 같다. 

2기 1차시험때는 제공해주신 HTML, CSS강의를 듣고 문제를 푸는것이었는데 선발과정이 좀 바뀌었구나..생각했다.

 

6월3일까지 1차 서류를 제출하고

6월4일에 1차시험을 보고

6월14일부터 2주간 2차수업과 시험을 진행하고

6/29(화) ~ 7/2(금)중 개별 안내 된 시간에 1:1 면접이 진행되었다.

그리고 7월5일(월)에 최종 발표가 난다.

적고보니 6월 한달간 네카라쿠베 스쿨 선발과정에 참여했다. 부디 좋은 결과가 나왔으면..!

계속 윈도우 기반의 컴퓨터만 사용하다 올해2월부터 맥을 사용하게 되었다.

리엑트 공부를 시작하면서 프로그램을 설치해야할 일들이 생겼는데 맥은처음이라 난감했던 기억이 난다.

그래서 정리해보는 홈브루를 쓰는 이유!

 

 

- Homebrew란?

Homebrew는 패키지매니저로 Apple(또는 Linux)에서 제공하지않는 유용한 패키지 관리자를 설치한다.

터미털에서 명령어를 작성해서 자신이 필요한 프로그램을 설치, 삭제, 업데이트를 손쉽게 관리할 수 있게 해준다.

 

- Homebrew를 쓰는 이유는?

Mac을 사용해서 프로그램을 설치하려면 보통 App Store나 해당 사이트에 접속해서 다운받아야한다.

하지만 이런경우 원치않는 프로그램이 자신도모르게 설치될수있고, 나중에 프로그램 재설지,삭제,업데이트할때 기존데이터가 남아있는 경우가 있으며 맥이 버벅대는경우도 나타날수 있다고 한다.

Homebrew를 사용하면 프로그램들을 설치하고 관리할때 이런문제 없이 컴퓨터를 관리할 수 있다. 그래서 Homebrew는 프로그램 사용이 많은 개발자가 손쉽게 패키지를 관리하기위해 사용하는 도구중 하나다.

Homebrew는 마우스로 클릭해서 설치하는 앱스토어가 아니라, 명령어를 쳐서 프로그램을 설치하고 관리하는 앱스토어라고 생각하면 된다. 

 

홈브루를 다운받으면 앞으로 프로그램을 설치할때는 $ brew install 프로그램명 이런식으로 설치하면 된다.

 

패스트캠퍼스에서 진행사는 네카라쿠배 프론트엔드 취업완성스쿨 2차 테스트에 참여하고있다.

2차테스트는 2주간(주중에) 수업을 듣고 매일 30분간 시험을 치루는 형태다.

javaScript를 배울줄 알았는데 준비하는 2주간 Python을 배우게되었다.

 

javaScript만 다뤄왔기때문에 Python의 개발환경을 설정하는것부터 쉽지가 않았다..!

브라우저에서 바로 실행되는건 참 편안한 일이었다..!

 

macOS를 사용하고있어서 패키지들을 brew를 사용해서 설치하고있는데,

수업에서는 바로 python3를 설치하라고 하셔서 알아보니 mac에 이미 깔려있는 python2.x.x와 충돌이 날까봐 역시나 brew로 설치해서 관리하는게 낫겠다는생각이 들었다.

여튼, 개발환경을 설정하고 가상환경을 설정하는 이런저런 과정들이 매끄럽지는 않았지만 해내고 나니 뿌듯하고 좋다 

 

javaScript도 항상 부족하다는 생각이 들고 React도 공부해야한다는 압박감에 다른 언어를 배워볼생각은 하지 못했는데,

파이썬을 배워보니 왜 알고리즘을 풀때 파이썬이 좋다는지 알 것 같다.

새로운걸 배우니까 오 재미있다 하다가 자바스크립트랑 리엑트도 아직 부족한데 내가 이걸 왜하고있지.. 싶다가도 또 재미있고..

 

다음주에는 본격적으로 알고리즘 수업으로 들어간다.

매일 많은양을 배우다보니 그날은 알겠다가도 다음날 되면 헷갈리고 그런 것 같다.

사실은 매일 이거말고 그냥 리엑트 공부나 할까 싶었는데 꾸역꾸역 하다보니 일주일이 지나갔다.

할까말까 할땐 하는게 맞는 것 같다..!😲

 

 

 

 

 

imbc탭메뉴 따라만들기

탭메뉴를 따라만들면서

1.한줄을 넘치는 글은 줄바꿈되지않고

2. 상자를 넘어가는 글은 숨기고

3.숨겨진 글의 자리는 말줌임표로 채우는 방법을 배워보았다.

 

1.  white-spacenowrap;

2.  overflowhidden;

3.  text-overflowellipsis;

 

이 세가지를 같이 써야 위의 이미지와 같은 말줄임표를 만들 수 있다.


1.white-space:nowrap;

white-space란?

화면상으로는 아무것도 표시되지 않는 문자.

스페이스(여백), 탭 문자(tab character:화면이나 인쇄되는 페이지상의 행과 열의 위치 맞춤에 사용되는 문자), 개행() 문자 등 화면상으로는 표시되지 않는 문자를 화이트스페이스라고 한다.

white-space의 속성값  
normal 연속된 공백과 줄 바꿈은 메꾸어져서 하나의 공백으로 표시된다.
소스(Source)내의 줄 바꿈 문자도 공백 문자로써 처리된다.
필요하다면 긴 줄을 줄바꿈 한다.
nowrap normal과 같이 공백을 채우지만, 가로로 긴 줄에서도 줄 바꿈을 하지 않고 표시한다.
pre 연속된 공백을 그대로 표시한다. 또한 긴 줄도 줄 바꿈하지 않고 표시한다.
pre-wrap 연속 공백은 그대로 유지된다.
행(行)의 줄 바꿈은 행의 박스를 채우기 위해 필요한 경우에 실행한다.
pre-line 연속 공백은 메꾸어져 하나의 공백이 된다.
행의 줄 바꿈은 행의 박스를 메꾸기 위해 필요한 때에 실행된다.

출처: https://www.tabmode.com/homepage/white-space.html#gsc.tab=0 

 

https://www.billionwallet.com/homepage/white-space.html

 

www.billionwallet.com

2.overflow:hidden;

overflow속성

요소의 콘텐츠가 너무 커서 요소의 블록 서식 맥락에 맞출 수 없을 때의 처리법을 지정합니다. 

[ visible | hidden | clip | scroll | auto ]{1,2}

 

Value definition syntax

CSS value definition syntax, a formal grammar, is used for defining the set of valid values for a CSS property or function. In addition to this syntax, the set of valid values can be further restricted by semantic constraints (for example, for a number to

developer.mozilla.org

 

3.text-overflow:ellipsis;

박스안에 내용이 넘칠때 텍스트를 어떻게 해야할지 처리하는 속성.

 

text-overflow속성은 다음2가지를 모두 충족시켜야 적용된다.
1.overflow값이 hidden,scroll,auto일때(visible제외)
2.white-space:nowrap(텍스트길어도줄바꿈되지않음)또는 텍스트가 다음줄로 이동하지 않는 비슷한경우

 

text-overflow속성은 block컨테이너를 넘치는 그 줄의 컨텐츠에만 적용가능하기때문이다.(컨텐츠의 아래로 넘치는 텍스트에는 쓸수없다.)

[ clip | ellipsis | <string> ]{1,2}

 text-overflow속성은 하나 또는 두 개의 값을 사용하여 지정할 수 있습니다. 하나의 값이 제공되면 행 끝 (왼쪽에서 오른쪽으로 텍스트의 오른쪽 끝, 오른쪽에서 왼쪽으로 텍스트의 왼쪽 끝)에 대한 오버 플로우 동작을 지정합니다. 두 개의 값이 제공되면 첫 번째 줄의 왼쪽 끝에 오버플로 동작을 지정하고 두 번째 줄의 오른쪽 끝에 해당 값을 지정합니다.

이제는 약간 감을 잡게된 text-align:center;와 margin:0 auto;의 차이에 대해 정리해보려고 한다. 

1. text-align

 

블럭요소에 text-align속성을 사용하면 그 안에있는 인라인 요소들이 정렬된다.
1.블럭요소에만 text-align속성을 쓸수있다.
2.블럭요소에 text-align을 쓰면 그 안의 inline요소들이 정렬된다.
3.텍스트뿐아니라 inline요소인 이미지도 가능


속성값: start/end/left/right/center/justify/march-parent
상속여부: 상속된다.

2. margin:0 auto;
블럭요소는 width:100%가 기본속성이다.
width값을 설정하면 width를 뺀 나머지는 margin처리가된다.
margin:0 auto;는 margin을 속기형으로 작성한 것으로, 풀어말하면 위아래 마진은 0, 좌우여백은 자동으로 주라는 의미이다.
따라서 블럭요소에 margin:0 auto;를 쓰면  width값이 있는 블럭요소는 width를 뺀 나머지 여백을 자동으로 나눠서 주기때문에 가운데 정렬이 되는 것이다.

inline 요소에 margin:0 auto;를 주면 인라인요소는 width가 자기크기만큼이고 자동margin이 생성되지 않아서 그 값은 auto로 나누라는 선언은 아무 의미가 없다. 


상속여부:상속안됨


margin:0px auto;라고 쓰다가 깨닳게된것.
margin:0 auto;로 써야하나 margin:0px auto;라고 써야하나 궁금해하다가 웹에서 px단위를 지양해야한다는걸 알게되었다.
px단위를 쓰면 접근성이 떨어진다. 글꼴크기를 16픽셀로 사용하면 브라우저사용자가 기본 글꼴크기를 20px 설정해도 무조건 16px로 보여진다. 사용자가 기본글꼴을 20px로 확장하면 그에따라 모든글꼴이 확장되어야하는데 그렇게 되지않는다.
글꼴크기를 픽셀단위로 설장한다해도 사용자는 브라우저창 크기조절(ctrl+휠, +)를 사용하면 전체요소를 확대할수있지만 브라우저의 기본기능인 기본글꼴크기 조절은 사용할수없게된다.

다음글에서 em/rem에대해 더 알아보려고한다.

 

 

객체지향 프로그래밍이라니 이름만 보고서는 아무 감이 잡히지 않는다.

여러 강의를 찾아봐도 형체없는것을 더듬고있는 기분.

하지만 이해하고싶어서 이것저것 찾아보며 알아본데까지 정리해보고 추가해나가려고 한다.

 

Object 객체, 물체

Oriented 방향을정하다

Programming 프그래밍

 

물체를 중심의 프로그래밍

모든것을 물체로 보려는 프로그래밍 을 의미.

 

객체지향말고 함수를 이용해 프로그램을 만드는 패러다임이 있었다.

이것들을 Procedural programming이라고 지칭하는데 

Procedural(절차적) 이라는 기능을 중요하게 생각한다.


절차적 프로그래밍이란 단순히 순차적인 명령 수행이 아니라 루틴, 서브루틴, 메소드, 함수 등(이를 통틀어 프로시저라고 한다.)을 이용한 프로그래밍 패러다임을 뜻한다. 명령형 프로그래밍의 일종이다.

'절차적 프로그래밍'이라는 한국어 번역은 오해의 여지가 크다. Procedural Programming에서 Procedural를 '절차적'으로 번역해버려서 마치 절차적으로 실행하는 것이 중점이 되는 것처럼 보이기 때문이다.

그런데 절차적이지 않은 프로그래밍이란 건 애초에 존재하지 않는다. Procedural의 Procedure는 '절차'라는 의미가 아니라 '프로시저'(C언어를 포함한 대부분의 언어에서는 함수라고 불리는 그것이다)의 의미이다.

이 패러다임에서는 프로시저 콜, 즉 함수 호출을 통해서 추상화와 재사용성을 얻어내는 것이 본질이기 때문이다. 그러나 이미 교과서에 절차적 프로그래밍이라고 줄기차게 쓰여져 있어서 굳어져버렸기 때문에 어쩔 수 없이 이 번역명이 사용되고 있다.

또 다른 문제로는 객체지향 프로그래밍과 비교를 해서 마치 객체지향의 반대이며 심지어 네이밍이 절차지향으로 알고있는 사람들도 있는데 일단 절차지향이라는 용어는 잘못된 표현이며 절차적 프로그래밍이 맞다. 해외에 검색해서 절차지향이 조금 나오기는 하나 대부분은 절차적 프로그래밍이라는 용어를 사용한다. 두번째로 객체지향이 절차적 프로그래밍의 반대 급부처럼 사용되는 것인다. 객체지향의 반대가 절차적프로그래밍인것은 당연하지만 전혀아니다. 더 정확히 말하면 절차적 프로그래밍의 관점이 프로시져에서 객체로 확장된것에 가깝기에 일치된다고 보긴힘들지만 공유하는 부분이 더 많다. 애당초 둘다 명령형 프로그래밍의 하위개념이기에 반대급부로 사용될 수 없다. 그래서 보통 제대로된 서적에서는 굳이 비교를 하자면 "객체지향과 일반적인 절차적 프로그래밍(쉽게말해서 객체를 사용하지 않는)"이라는 단서를 붙힌다.

함수형 프로그래밍과도 비슷한 논란이 있는데 현대언어에서의 프로시져와 함수의 구분은 없어진거나 다름없기에 둘은 동등한건지에 대한 논란이 있으나 애당초 관점이 다른 용어이기 때문에 당연히 둘은 다르다. 함수형 프로그래밍의 관점은 순수함수와 일등객체인 함수에 관심이 있는 것이고 절차적 프로그래밍은 함수(그리고 이를 관리하는 모듈)에 의한 재사용성에 초점을 둔 것이다.

 

출처: 나무위키


Functions=routine=subroutine이고 함수를 이용해 프로그램을 만드는 패러다임을 말한다.

이런 procedural기반에서 procedural의 부족함을 보완한것이 object프로그래밍이다.

두가지의 중요한 차이는. procedural함수가 있었고, 함수보다 더 큰 틀의 정리도구인 '객체'가 존재한다는 것이다.

 

비유적으로 생각을 해보면 a라는 정보가 있다. 적으면서 기록했다. 종이에 기록하다가 많아지니 서로연관된 정보를 기록한 종이를 그루핑할필요가 있어졌다. 그렇게 책을 만들게되었다. 책이많아 책장을 만들고. 책장이 여러개가되어 서재를 만들었다. 서재가 커져서 도서관이 되었다.

정보기술의 발달로 전세계르 인터넷으로 연결해서 링크, 검색을 통해 정보검색할 수 있는 전세계적 규모의 도서관이 만들어진게 오늘날 우리가 사는 세상이다. 

양이 늘어난다는것은 완전 다른 관리체계가 필요해진다는 것이다.

늘어나는 것을 관리할수 없다면 쌓이는 정보는 쓸모가 없어지고 양이늘어 괴로움만 줄 뿐이다.

 

프로그래밍도 처음엔 어떻게만들까에 집중해 만들어내다보니 시간이 지나면서 코드간섭이 일어나고 프로그램도 기하급수적으로 복잡해졌다. 인간이 감당할 수없는 수준의 복잡도에 도달해버린 프로그램을 어떻게 해야할까?

1. 들어있는 내용물을 버리고 새로운 기능을 넣는다.

2. 있는 기능을 잘 정리해서 그 기능을 작게 압축한다.

복잡한것의 복잡도를 낮추지 않으면 우리가 만들 프로그램을 더 나가가게 할 수 없어진 것이다.


널부러진 여러가지 장난감을 모아서 toy라고 이름붙인 상자에 넣으면, 이제 우리는 그 안에 뭐가 들었는지 신경쓰지 않고 상자의 이름만 신경쓰면 된다. 정리정돈되니 뇌가 편안해진다.

지금까지의 수납상자는 function 이었고 method였다.

function do( ){

복잡한코드~~~

복잡한코드~~~

복잡한코드~~~

복잡한코드~~~

}

우리는 이제 복잡한 코드는 신경쓰지 않고 do( )라는 함수를 호출해서 do의 기능을 쓸 수 있다.

함수do가 어떤일을 하는지 알면 세세한 내용을 신경쓰지 않고 가져다 쓸 수 있게된다.

복잡한 코드가 한줄의 코드로 간결해진다. 이것이 함수의 폭발적인 효과인것이다.

 

하지만 함수도 프로그래밍 역사에서는 나중에 등장한 것이다. 함수로 복잡도 낮추기에 성공해서 여유가생겼고

우리는 또 새로운 기능들을 추가하게된다.

여러함수가등장하고 또 인간이 감당하기 어려울정도로 많아진다.

관리하기위해 비슷한기능을 가진 함수들끼리 이름을 비슷하게하거나 같은위치에 모아두는 노력을 했지만 

우리는 근본적 해결책을 생각해보게 된다.

그렇게 제시된 방법중 하나로 널리 사용되고있는것이 객체지향 프로그래밍이다.

 

서로 연관되어있는 함수와 변수들을 '객체'로 그루핑한다. 

do1()

do2()

do3()

...

를 toy라는 이름의 객체로 묶는다.

그리고 이렇게 묶은 함수들을 부를때

toy.do1()

toy.dp2()

toy.do3()

라고 한다.

이런 방법으로 서로 연관된 함수들을 다른 함수와 구분되게 하는 것. 분류되게 하고 정리정돈 하는 것이 객체지향의 핵심 아이디어다. 물론 객체지향은 이 외에도 다면성을 가지고있다.

 

객체지향이 뭔지 한마디로 정의하는것은 인간이 무엇인지를 정의하는 일처럼 어려운 일이다.

객체지향의 다면성 중 하나인 연관된 함수와 변수를 그루핑하고 이름붙여 쓰는것.을 기억하고 출발하면 좋을것.이라고 한다.

 

어렵다..!

 

 

 

'Study > 이해하고싶다 : 용어' 카테고리의 다른 글

터미널, 단말기  (0) 2020.06.27

+ Recent posts