본문 바로가기

전체 글

(215)
충남대학교 SW 아카데미 조교 기록 2주차 CNU SW 아카데미가 1기이다보니 정해진 것들이 많이 없다. 그래서 교수님과 팀장님과 대화를 통해 프로그램의 활발한 참여를 유도할 수 있도록 생각을 많이 해봤다. 일단 학생과 조교, 조교와 교수님, 팀장님과의 소통을 원활하게 하기위해 카톡 및 Slack을 만들었다. 슬랙에서는 자기소개방, 잡담방, 전체공지방등을 만들어놨고 소통이 훨씬 더 효율적으로 진행되었다. 소모임 다음으로 도입한 것은 소모임이다. 소모임을 도입해서 학생들간 소통 및 공유 문화를 활성화 시키고자 했다. Velog 아무래도 학교에서 진행하는 프로그램이다보니 개발이 처음이신분부터 컴퓨터 공학과 4학년에 이르기까지 다양한 범위의 스펙트럼이 존재하는데 공부한 내용을 쉽게 정하는 방법을 알려드리기 위해 markdown으로 정리하는 방법을 설명..
Rendering Patterns 소프트웨어 마에스트로 컨퍼런스 발표 (22.07.07) 안녕하세요 소프트웨어 마에스트로 연수생 프론트엔드 개발자 이현진 입니다. 웹 페이지를 그리는 다양한 렌더링 방식 즉 Rendering Pattern들에 대해 이야기 해보겠습니다. 렌더링은 브라우저 화면에 웹 페이지를 그리는 것을 말합니다. 먼저 유저가 브라우저를 통해 서버에 요청을 보내고, 서버는 이에 응답으로 html, css, JavaScript를 보내줍니다. 브라우저는 이를 해석하여 웹 페이지를 그립니다. (렌더링을 수행하는 브라우저의 프로세스를 렌더러 프로세스라고 합니다.) 브라우저가 화면에 html, css, JavaScript를 그리는 과정(절차)를 CRP(Critical Rendering Path)라고 합니다. 이 과정은 우선 DOM T..
충남대학교 SW 아카데미 조교 기록 1주차 CNU SW 아카데미 조교를 맡게 되었다. (22.07.04) CNU SW Academy CNU SW 아카데미 ? 대상자: SW 취업 준비 중인 충남대 4학년 재학생과 졸업생 교육기간: 4개월(16주, 8시간/1일) 교육내용: SW 교육과정 (백엔드, 프론트엔드, 클라우드, AI/데이터) 특징: 참여기업과 수 sites.google.com 이 글은 내가 조교활동을 한 내용을 정리한 글이다. (07.04 ~ 07.08) 1주차 발표 웹은 어떻게 발전했는가. (07.05) 정보화본부 3층에 가서 발표를 진행했다. 처음에 화면 공유가 잘 안되서 시간을 많이 잡아먹었다. 발표 내용은 소프트웨어 마에스트로 컨퍼런스에서 발표했던 내용을 조금 수정해서 발표 했다. 질의 응답까지 한 한시간 정도 한 것 같다. 1주차 ..
Pre-rendering 기본적으로 Next.js는 모든 페이지를 pre-render한다. client-side JavaScript가 페이지의 HTML을 다 그리는 것이 아니라 미리 각 페이지를 위한 HTML을 생성한다. 각각 생성된 HTML페이지는 최소한의 자바스크립트와 연관되어있는데, Client Side에서는 브라우저에 페이지가 로드되었을 때, 자바스크립트가 페이지를 완전히 완성시킨다. 이 과정을 hydration이라고 한다. hydration 페이지가 브라우저에 로드되고 자바스크립트 코드가 실행되면서 페이지가 인터렉티브 하게 동작하는 상태가 되는 과정 Pre-rendering 방식을 제공하는 Next.js는 우선 HTML 파일을 통해 정적인 화면을 먼저 보여준다. 이후 JS 파일을 로드해와서 화면에서의 클릭 등의 이벤트 ..
1268. 임시 반장 정하기 문제 보러가기 🅰 설계 반의 정보를 입력으로 받고, N명이 같은 반이었던 사람의 수를 카운팅하기 위해서 cnt 라는 리스트를 선언한다. cnt = [0] * N 그 후엔, N명을 순환해야하는데, 이때 5개의 학년에 대해서 순환해야하고, 그리고 순환할 때 자기 자신과는 비교하면 안된다. 비교의 기준이 되는 학생과 나머지 학생과 같은 반 이었던 적이 있으면 visited 를 True 로 바꾼다. 마지막에는 visited 의 True 값의 합을 cnt 의 각 학생에 해당하는 곳의 인덱스에 저장한다. ✅ 후기 // 새롭게 알게되거나 공유해서 알게된 점 세로로 나열된 변수들을 관리하기 위해서 새로운 리스트를 만들었고 그 리스트에 변수들을 넣었다.(몇 반이었는지) 어떠한 학년에서 같은 반이 었던 아이들은 반복문을 ..
자바스크립트 완벽 가이드 | 객체 객체 객체는 복합된 값이다. 객체는 여러가지 값(기본 값이나 다른 객체)을 모아서 이름을 통해 값을 저장하고 가져올 수 있게 한다. 객체는 프로퍼티의 순서가 없는 집합이며 각 프로퍼티에는 이름과 값이 있다. 포로퍼티 이름은 보통 문자열로 객체가 문자열에 값을 연결한다고 볼 수도 있다. 객체는 단순히 문자열과 값을 연결한 것이 아니다. 자바스크립트 객체는 자신만의 프로퍼티를 가지는 것 외에도, '프로토타입'으로 불리는 다른 객체에서 프로퍼티를 상속하기도 한다. 객체의 메서드는 일반적으로 상속된 프로퍼티이며, 이 프로토타입 상속이 자바스크립트의 중요한 기능이다. 자바스크립트 객체는 동적이기 때문에 일반적으로 프로퍼티를 추가하거나 삭제할 수 있지만, 정적인 객체를 흉내낼 수도 있고 정적 타입을 사용하는 언어의..
객체지향의 사실과 오해 | 7장 코드와 모델을 밀접하게 연관시키는 것은 코드에 의미를 부여하고 모델을 적절하게 한다. - Eric Evans 개념관점(Conceptual Perspective)에서 설계는 도메인 안에 존재하는 개념과 개념들 사이의 관계를 표현 명세 관점(Specification Perspective)에 이르면 사용자의 영역인 도메인을 벗어나 개발자의 영역인 소프트웨어로 초점이 옮겨짐. 명세관점은 도메인이 아니라 실제로 소프트웨어에서 살아 움직이는 객체들의 책임에 초점을 맞춤. 구현 관점(Implementation Perspective)은 실제 작업을 수행하는 코드와 연관돼 있다. 구현 관점의 초점은 객체들이 책임을 수행하는데 필요한 동작하는 코드를 작성하는 것이다. 클래스는 위 세가지 관점을 모두 수용할 수 있도록 개념..
객체지향의 사실과 오해 | 6장 유일하게 변하지 않는 것은 모든 것이 변한다는 사실뿐이다. - Heraclitus of Ephesus 객체지향은 자주 변경되는 기능이 아니라 안정적인 구조를 기반으로 시스템을 구조화한다. 역할,책임,협력을 기반으로 시스템의 기능을 구현하는 책임-주도 설계의 본질을 이해하는 데도 도움이 될 것이다. 기능 설계 대 구조 설계 모든 소프트웨어 제품의 설계에는 두 가지 측면이 존재. 하나는 기능 측면의 설계이고, 다른 하나는 구조측면의 설계이다. 설계의 가장 큰 도전은 기능과 구조라는 두가지 측면을 함께 녹여 조화를 이루도록 만드는 것. 훌륭한 기능이 훌륭한 소프트웨어를 만드는 충분조건이라 한다면 훌륭한 구조는 훌륭한 소프트웨어를 만들기 위한 필요조건이다. 미래에 대비하는 가장 좋은 방법은 변경을 예측하는 것이..