javascript - 현재 웹사이트를 개발하는 데 일반적으로 어떤 방법이 사용됩니까? 프런트엔드와 백엔드 분리란 무엇입니까?

저는 항상 독학을 했기 때문에 대기업에서는 웹사이트를 어떻게 작성하는지 잘 모릅니다. 과거에는 html에 jsp나 php 코드를 삽입하여 작성한 웹사이트가 많았습니다. 이전에도 node jade 방식을 사용했었는데 이제는 백그라운드에서 인터페이스가 제공되고, 그 후 Ajax가 제출되어 데이터를 얻은 후 백본 템플릿에 표시됩니다. 그렇다면 일반적인 접근 방식은 무엇입니까? 바이두 선배님께 물어보니 똑똑하게 말씀해주셨는데, 저도 잘 이해가 안 됐어요. 조언 부탁드립니다. 감사합니다

답글 내용:

저는 항상 독학을 했기 때문에 대기업에서는 웹사이트를 어떻게 작성하는지 잘 모릅니다. 과거에는 html에 jsp나 php 코드를 삽입하여 작성한 웹사이트가 많았습니다. 이전에도 node jade 방식을 사용했었는데 이제는 백그라운드에서 인터페이스가 제공되고, 그 후 Ajax가 제출되어 데이터를 얻은 후 백본 템플릿에 표시됩니다. 그렇다면 일반적인 접근 방식은 무엇입니까? 바이두 선배님께 물어보니 똑똑하게 말씀해주셨는데, 저도 잘 이해가 안 됐어요. 조언 부탁드립니다. 감사합니다

프런트엔드와 백엔드가 분리된 이유는 과거에는 jsp, asp 등의 동적 스크립트를 사용하여 웹사이트를 개발했기 때문입니다.
백엔드 언어, javascript, css, html을 통합한 jsp, asp 등의 혼합 스크립트는 코드 개발 및 유지 관리를 매우 불편하게 만듭니다.
프런트 엔드 상호 작용이 점점 더 복잡해짐에 따라 jsp 및 asp와 같은 스크립트 구문은 더 이상 개발 요구 사항을 충족할 수 없습니다.
그래서 프론트엔드와 백엔드의 개념이 제안되었습니다. 프론트엔드 담당자는 페이지 표시 및 상호작용을 담당하고, 백엔드 담당자가 작성한 데이터 인터페이스를 Ajax를 통해 호출합니다.
그러므로 웹사이트 개발의 핵심은 기본적으로 다음과 같습니다.

1. html CSS: 페이지 표시

2. javascript ajax(브라우저의 일부이며 javascript를 통해 호출할 수 있음): 페이지 상호 작용, 논리 처리

일반적인 개발 프레임워크 선택:

1. 간단한 웹사이트: jquery bootstrap

2. 백엔드 관리 시스템:angularjs jquery bootstrap webpack

3. 복잡한 제품: React Redux 웹팩

요즘 웹사이트 개발은 기본적으로 프론트엔드와 백엔드가 분리된 모델입니다. 백엔드는 인터페이스만 작성하고 프론트엔드는 인터페이스를 호출하며, arttemplate.js와 같은 js 템플릿 엔진을 사용하여 데이터를 렌더링합니다. sea.js와 같은 일부 js 모듈 개발 프레임워크도 사용됩니다.

글쎄, 지금은 페이지를 작성하지 않습니다. 프런트엔드는 페이지를 작성하여 CDN에 직접 넣은 다음 백엔드에서 제공하는 인터페이스를 호출하여 렌더링할 데이터를 얻습니다.

smarty는 프론트엔드와 백엔드를 분리하는 템플릿 엔진입니다. 핵심 내용은 MVC
M = Model
V = View
C = Controller

입니다.

이 질문은 매우 광범위합니다. 웹사이트는 작은 것부터 큰 것까지 다양한 범주로 나눌 수 있습니다. 즉, 둘 다 웹사이트라고 불리는데, 삼류 도시의 작은 상점 홈페이지와 타오바오는 모두 웹사이트라고 부르지만 전반적인 발전은 매우 다릅니다.

실제로 요구 사항을 더 빠르게 구현하고, 요구 사항 변경에 대응하고, 향후 유지 관리를 용이하게 하는 방법에 대해 스스로 연구하고 더 많이 생각해 보십시오. 어떤 것이 더 나은가요? 이를 이용하는 기업도 있다. 현재로서는 jsp나 php에서 html을 직접 작성하는 경우는 거의 없습니다. 앞부분과 뒷부분의 분리가 궤도에 있습니다. 따라서 누가 더 많이 점유하고, 누가 덜 점유하는지를 어떻게 구분하느냐는 각 기업의 기술 수준에 따라 다르다. 프론트엔드 개발 엔지니어가 실력이 좋을 때는 프론트엔드 mvc와 mvvm만 생각하고 바로 나갑니다. 백엔드가 훌륭하다면 이 프로토타입을 백엔드에 제공하고 나머지는 걱정하지 않아도 된다고 생각합니다.

질문에서는 node jade가 백엔드이고 백본이 프론트엔드입니다. Smarty는 PHP의 오래된 템플릿입니다. 노드의 옥과 유사합니다.

그렇다면 당신은 프론트엔드인가요, 백엔드인가요, 아니면 풀엔드인가요? 먼저 java, node, php 등 좀 더 깊이 있는 언어를 사용하는 것이 가장 좋습니다. 모든 것을 알 필요도 없고 아무것도 알 필요도 없습니다. 돌아가서 문제가 무엇인지 확인하고 자세히 논의하겠습니다.

이것과 관련이 있나요? 루틴은 기본적으로 동일하며 더 많은 레이어로 나누어질 수도 있지만 본질은 동일하게 유지됩니다. 모두 연습하고 더 많은 실제 경험을 얻으세요. 차이가 없습니다.

html 아약스

질문하고 싶은 내용이 아래에서 설명할 내용인지 잘 모르겠습니다.
웹사이트의 프론트엔드와 백엔드 분리에 관해서는 총론을 읽어보았습니다. 질문 세부 사항에 대한 설명은 이전 PHP와 같을 수 있습니다. 코드는 html 코드로 작성되었습니다. 순수한 php 파일은 없으며(php 코드만 들어 있음) 여기서는 앞부분과 뒷부분이 분리되지 않습니다. 이는 대략적으로 php와 html을 의미합니다. 나는 당신 안에 있고 당신도 나에게 있습니다.
그러나 개발 중에 프론트엔드(html, css, js) 엔지니어가 PHP를 읽지 못할 수도 있습니다. PHP 엔지니어들은 CSS 내용에 익숙하지 않기 때문에 나중에 사람들이 코드를 변환하는 방법을 생각해 냈습니다. 이렇게 하면 각자의 분야에서 더 나은 성과를 낼 수 있지만 어느 정도 효율성이 떨어지기는 하지만 친숙합니다.
스마티 템플릿이 대표적인 예입니다. 프론트엔드(사용자용)와 백엔드(사용자 요구를 실현하는 기능)를 분리하여 다양한 개발자가 플레이할 수 있도록 했습니다.

Smarty는 말씀하신 백엔드 코드에 대해 프론트엔드에 구현된 템플릿 엔진입니다. Ajax는 전후 분리를 달성하기 위한 비동기 작업입니다.

프런트엔드와 백엔드의 분리는 인터넷에서 말하는 것만큼 복잡하지 않습니다.

1. 먼저 모든 프로그램은 데이터를 기반으로 한다는 점을 알아야 합니다. 데이터가 없는 프로그램은 프로그램의 추가, 삭제, 수정, 확인이 실질적인 의미가 없습니다.

2. 프론트엔드와 백엔드 분리는 데이터 연산과 표시를 분리하는 것입니다. 프런트 엔드는 데이터 표시에 중점을 두고 텍스트, 그림 또는 아이콘을 통해 데이터를 직관적으로 표시합니다. 백엔드는 데이터 작업에 중점을 둡니다. 프런트엔드는 백엔드로 데이터를 보내고, 백엔드는 데이터를 수정합니다.

3. 백엔드는 일반적으로 java, c# 및 기타 언어를 사용합니다. 현재 노드는 JavaScript에 속하며 여기서는 언어를 크래킹할 필요가 없습니다. 백엔드는 데이터베이스에 연결하고 데이터를 작업하는 데 사용됩니다.

4. 백엔드는 프런트엔드가 데이터에 대한 백엔드 작업을 트리거하기 위해 호출할 수 있는 인터페이스를 제공합니다.

언어는 정확하지 않을 수 있지만 생각은 정확하다는 것이 기본 원칙입니다.