프론트 엔드/백 엔드

  • 고준희

    [프론트 엔드 / 백엔드]

    • What:

    유튜브를 보는 상황으로 비유를 해 보자면

    <프론트 엔드=""> 유튜브 들어가서 검색을 한다. 원하는 영상을 클릭한다. <백엔드> 서버에서 자료를 가공한다. 가공한 자료를 보내준다. 프론트엔드 개발자라 함은 HTML, CSS, JS등으로 어떤 페이지를 만들어내는 사람들은 얘기한다. (안드로이드 개발자, ios개발자, 클라이언트 개발자, 웹 개발, 클라이언트 개발) 백 엔드 개발자의 경우는 db에 데이터를 적재하고 관리하고 데이터를 통해서 활용가능한 API를 만든다. In software engineering, the terms front end and back end refer to the separation of concerns between the presentation layer (front end), and the data access layer (back end) of a piece of software, or the physical infrastructure or hardware. In the client–server model, the client is usually considered the front end and the server is usually considered the back end. - Why: 너무 포괄적인 개념어라 딱히 why에 해당하는 부분이 없는 것 같지만(what 이 곧 why) 대략 적어보면 프론트 엔드 – 사용자가 쉽게 이용할 수 있게 끔 웹 앱을 깔끔하게 디자인한다. 백 엔드 – 클라이언트가 요청한 자료를 신속, 정확하게 전달하고 자료를 관리한다. - How 프론트엔드 로드맵 https://roadmap.sh/frontend HTML(사이트의 골격을 형성) CSS(사이트 디자인) JavaScript(다양한 동작, 기능을 덧붙일 수 있음) 위 셋이 가장 기본적으로 쓰임 –기본적인 웹사이트 만들 수 있음 백엔드 매우 다양한 언어, 프레임워크, 라이브러리로 구현 ---

  • 이현복

    ## what?

    프런트 앤드

    웹페이지에서 사용자의 눈에 보이는 곳을 관리하는 것

    백엔드 API(Application Programming Interface) 에서 가져온 데이터의 출력

    입력을 통한 비즈니스 로직(업무에 필요한 데이터처리를 수행하는 응용프로그램)을 구성

    사용자와 대화하는 인터페이스

    백 엔드

    웹페이지에서 사용자의 눈에 보이지 않는 곳을 관리하는 것

    DB(DataBase)

    API 서버 개발

    ## why?

    프런트 앤드와 백엔드를 구분시킨 이유

    Modularity(모듈화)

    다른 모듈에 영향을 미치지 않고 작업하기에 수월하기 때문이다.

    여러명의 개발자가 다른 사람을 신경쓰지 않으며 작업할 수 있게 해준다.

    Scalability(확장성)

    둘로 나뉘어 있기에 코드 최적화에 적합하다

    확장 시 주로 백엔드가 자원을 더 많이 요구하므로 효율적인 자원 분배를 가능하게 한다.

    자원 최적화

    분업이 되지 않는다면 데이터의 변환, 회수, 최적화 그리고 HTML 이미지화 까지 모두 수행해야 한다. 분업 시엔 사용자의 작업마다 이 모든 과정에 진행되지 않아도 된다.

    ## how?

    프런트 앤드

    HTML(Hypertext Markup Language) : 웹 페이지를 위한 지배적인 마크업 언어

    CSS(Cascading Style Sheet) : HTML 요소들이 미디어에서 어떻게 보이는가를 정의하는 데 사용되는 스타일 시트 언어

    Javascript : 객체 기반의 스크립트 프로그래밍 언어

    백 엔드

  • 김건호

    # Database

    ## what?

    일정한 체계 속에 저장된 데이터의 집합 그리고 그것을 다루고 관리하는 프로그램을 뜻한다.

    ## why?

    파일보다 훨씬 더 효율적이고 구조적으로 데이터들을 관리할 수 있다.

    spreadsheet를 생각하면 된다. ex)날짜별 정렬, 원하는 속성 값에 해당하는 데이터 정렬 등..

    ## how?

    ‘database ranking 2020’ 검색, ex) DB-engines

    DB-Engines Ranking

    주로 관계형 DBMS가 상위권을 차지하고 있다. ex)오라클, MySQL

    관계형인 것과 아닌 것의 공통적인 부분. -> 데이터베이스의 본질 다른 점 -> 데이터베이스의 형식이 한정되어 있진 않다.

    • Oracle : 자금력이 있는 기업 or 정부에서 사용
    • MySQL : 무료, 오픈소스 제공, 작은 회사. —

  • 정효인

    # Frontend & Backend

    ## What

    말그대로 설명하자면, 프론트엔드란 사용자 ‘앞’에 보여지는 웹페이지를 꾸미는 것이다. 백엔드란 사용자가 못보는 ‘뒤’ 즉, 프론트엔드 뒤 데이터베이스나 서버를 관리하는 것이다.

    ※ 프론트엔드와 백엔드 모두 개발할 줄 아는 사람을 ‘풀스택 개발자’라 한다

    ## Why(왜 프론트엔드와 백엔드를 구분하는가?)

    프론트엔드 개발자와 백엔드 개발자 성향 분석:

    프론트엔드 개발자같은 경우 페이지 내에서 마우스가 움직이는 모션(슉~ 움직이는 것과 슈슉~ 움직이는 것에도 설명하는 많은 용어들이 있다고 함), 페이지색, 페이지 구성 등 사용자에게 보여지는 요소들을 관리/개발하기 때문에 섬세한 면모가 있어야 한다.

    반면에 백엔드 개발자 같은 경우 큰 그림을 보는 것을 좋아하는 사람이 하면 제격이다. 아무래도 전반적인 데이터베이스/ 서버 관리를 하기 때문에 전체적인 틀/설계를 잘 하는 것이 백엔드 개발자의 능력으로 이어지기 때문이다.

    (사실 자신에게 뭐가 맞는지는 직접 해봐야 알 수 있다.)

    ## How

    노마드코더(인터넷 강의)

  • 김윤재

    프론트엔드, 백엔드

  • 임수환

    What?

    -

    Why?

    -

    How?

    -