python simple application demo with angular

오늘 다시 오신 것을 환영합니다 간단한 응용 프로그램에 대해 내가 갈 방법을 보여줄거야

파이썬을 백엔드로 연결하고 프런트 엔드로 각도 JS를 그리고 난 아니에요 당신에 대해 데이터베이스와 모든 이것은 매우 간단한 응용 프로그램을 사용하는 것입니다 응용 프로그램의 의미를 이해해야합니다 웹 응용 프로그램 흐름이 실제로 작동합니다 나는 많은 것에 대해 논의하지 않는다는 것을 의미한다 이론적 인 부분과 우리는 단지 당신을 공유 github의 코드뿐만 아니라 나는 그냥 코드를 설명해 줄거야

그것을 실제로 이해하는 방법 웹 프런트 엔드 부분 백엔드 부분과 통신하다 데이터를 가져 와서 프런트 엔드 및 디스플레이 및 내가 보여주고있는 응용 프로그램은 네가 할 수있는 간단한 앱이라고 너에게 말했다 펜톤에 의해서만 그것을 달성하지만 아직도 나는 내가 원하는대로 주문했다 어떻게 행동하는지 보여줘 나는 실제로 사이의 패스의 데이터 프런트 엔드 백 엔드는 내가 이 반을 보여 주므로 나에게 괜찮아

그래서 나는 ID라는 ID를 사용하고 있습니다 하위 라이트와 자바 스크립트를 사용하고 있습니다 angularjs라는 라이브러리 오늘은 사람들이 프런트 엔드에 더 많이 사용 지금은 이미 응용 프로그램이지만 언어에 대한 각도 생성기 너무 꽉 찼지만 각도를 사용하고 있습니다 15 당신이 이해할 수 있도록 프론트 엔드 코드는 그렇게 모든 정적 파일은 실제로 각도 JS입니다

각도가있는 JS 파일을 보지 마십시오 나는 그것을 MVC에서 MVC처럼 디자인 할 것이다 아키텍처 우리가 무엇을 부를 수 있는지 모델보기 컨트롤러 아키텍처로 그래서 이것은 전망이고 이것은 스타일입니다 각도 나이 애플 리케이션은 광고 도트 JS로 시작합니다 파일이므로 AB 도트 JS 파일입니다

모든 응용 프로그램이 시작된다는 것을 알기 때문에 색인 파일이 주 파일임을 의미합니다 시작 또는 귀하의 측면에서 인덱스 도트 PY 내가있는 곳 기본적으로 doctype HTML을 사용하십시오 그리고 html5를 사용하면 이것이 내가 보여줍니다 사용하여 나는 그렇게 html5 사용하고 있습니다 내가 가지고있는 각도의 JS 모자를 시작하라

같은 ng F를 정의하는 것은 첫 번째와 같다 반은 모두 문자 다 우리가 일반적으로 브라우저에 사용하도록 설정 호환성 목적 또는 tivo와 같은 검색 목적 목적과 응답 목적 우리는 제목이있는이 메타 태그를 사용합니다 기본적으로 내가 보여줄 제목 당신은 제목이 실제로 오는 곳에 그것을 한 화면 더 두 번째 화면 창 캡쳐를 캡처하지 못했습니다 Chrome에 알려서 보여 드리겠습니다

차가운 오케이 그래서 오 오 여기에서 볼 수있는 제목은 제목을 정의하는 것이므로이 그들이 세련된 발을 사용하고 있지만 부트 스트랩 점 CSS 부트 스트랩 기본적으로 CSS 프레임 워크입니다 당신은 많은 준비 스타일을 갖게 될 것입니다 사용할 수 있습니다 클래스 또는 ID 및 메인 도트 CSS 여기에 언급 된 것은 내 자신의 CSS입니다

나는 이것을 디자인하도록 썼다 응용 프로그램 및 jQuery 알고 내가 가지고있는 자바 스크립트 라이브러리 다운로드하고 그것을 추가하고 모두보기 앱 유형에 추가 한 것들 하프 J의 jQuery가 J의 점을 볼 수 있습니다 if 당신도 여기 보시면 여기 있습니다 이것은 내가 가지고있는 jQuery 라이브러리이다 JS가 / JS / jQuery에 J를 추가하여 AB를 추가했습니다

그래서 이것은 jQuery와 플러그인입니다 그리고 angularjs 분이게 angularjs 나는이 디자인 기초를 부르고있다 전화를 걸면 색인 파일을 알 수 있습니다 여기에 내가이 지수에서 나오고있다 도트 슬래시로 파일을 작성하고 있습니다

내부 절반은 내가있는 애플 리케이션 폴더 안에 J 폴더가 있습니다 이 각도의 JS 미니와 jQuery와 낚시꾼은이다 그래서 다음은 AB 도트 J입니다 메인 js5 및 컨트롤러와 서비스는 이 컨트롤러는 내 것이라고 컨트롤러와 나는 같은 서비스를 가지고있다 이건 내 서비스 괜찮아요

그것에서 ok와 ok 이것은 머리 부분이다 내가이 몸을 사용할 때 나는 이것을 사용하고있다 부트 스트랩 클래스와 제목 표시 줄입니다 내가 실제로있는 CSS 클래스입니다 부트 스트랩 클래스를 오버라이드하고 내 텍스트가 보이는 경우 태그 텍스트입니다

응용 프로그램은 단어에 오신 것을 환영합니다 참조하십시오 그들은 이것이 P 태그임을 알고 있습니다 여기서는 라우팅 경로를 사용하고 있습니다 웨이브 라우팅 경로를 보여 드리겠습니다 이것은 AB 도트 JS 파일이므로 이것은 하프 네임 여기에서 볼 수 있다면 여기에 색인 이게 상반기 야 그래서 나는 단지 각 도트 모델에서이를 더한다

첫 번째 앱과 나는 의존성 나는 루트와 내 경로를 사용하고있다 하나의 컨트롤러와 하나의 컨트롤러를 제어해야합니다 내가 쓰는 서비스들 C를 가져 오면 이것이 다른 방법입니다 MJ 루트 우리가 그렇게하는 루트 제공자를 의미합니다 기본적으로 나는 어디에서 말을 썼는가? 르네상스 때 또는 다른 때 슬래시보다 가서 데이터를 가져와야합니다

어느 곳에서든지 메인 도트 html '그래서 내 템플릿이므로 쇼 당신에게 메인 도트 HTML 그래서 이것은 내 주 도트 HTML 내가 작성한 곳 이 양식이 완전하므로 간단한 양식 부트 스트랩과 angularjs 코드 그래서 기본적으로 양식 무엇이든 쓰여진 함수는 어느 것이 든 단어의 수를 세는 것 너는 이렇게 쓸거야 이 양식을 정의하는 양식 입력 강 단어를 입력 하고이 텍스트 영역을 정의하는 곳입니다 모델 텍스트 데이터 도트 텍스트를 입력하십시오 기본적으로 텍스트 데이터를 보내는 곳 그래서 주 컨트롤러 점이 보이면 HTML이 컨트롤러이기 때문에 그래서 여기에 정의 된 파일을 가정 해 봅시다 이 템플릿에 슬래시가있는 경우 이것은 컨트롤러가 무엇인지 AB 도트 J가 주 파일에 파일을 알려줍니다

메인 도트 HTML 그래서 메인 도트 HTML은 여기에서 제어하므로 텍스트가 있습니다 지역과 나는 여기에 텍스트 데이터를 원한다 텍스트 데이터를 객체로 정의했다 그래서 텍스트 데이터 도트 텍스트 입력은 객체 속성의 객체 여기에 뭔가를 입력하면 angularjs는 양방향이기 때문에 데이터 바인딩 그래서 그것은에 반영 될 것입니다 JavaScript 파일 이제 JavaScript 데이터 나는 JavaScript 객체로 객체에있다

그래서 여기에 제가 제출하기 때문에 이것은 mg입니다 이 말을 할 때 기본적으로 사용 중지됩니다 양식이있는 경우 조건을 확인하십시오 유효하지 않음 버튼을 한 번 사용 중지합니다 양식이 유효하게되고 나만 이걸 제출하면됩니다 일단 당신이 응답을 얻을 수있는 기능 그런 말을하고있어서 내가 먼저 응용 프로그램이 어떻게 작동하는지 보여줍니다

예를 참조하여이 응용 프로그램을 실행하지 마십시오 너를 어떻게 보여줄 수 있니? 이것 때문에 좋아 그럼이 병으로 설명해 줄게 프레임 워크와 파이썬 코드 점수뿐만 아니라 이제는 파이썬을 보여 드리겠습니다 가상 환경 활성화 그래서 공기 물건 점 py는 다섯 다섯 그래서 ok 이후 나는 또한 요구 사항 점 맛의 세계 테스트는 내가 이렇게 만들고있는 환경 기본적으로 가상을 만드는 방법입니다 환경을 가르쳐주세요

이전 세션 나는 모두를 보여 줬어 우리가 어떤 토너먼트가 될지 가상 환경 만들기 가상 래퍼 및 모든 그래서 그것은 단지 요구 사항 도트를 계속 작성하십시오 txt를 설치하고 요구 사항 도트를 설치하십시오 txt뿐만 아니라 시계 elementals 한 번 확인 LS도 만들었습니다 pip by n SQ는 우리의 요구 사항을 설치합니다 dot txt 그래서 이것은 모든 것을 설치할 것입니다

파이썬에 필요한 것들 내가 아무런 걱정도하지 않은 프로젝트 github에있는 모든 코드를 공유했습니다 아래에 링크를 저장합니다 당신이 파이썬을한다면 그렇게 접근 할 수 있습니다 짧은 파이 그리고 만약 당신이보기 폐쇄 너무보고 이전에 다른 포트를 실행 중입니다 지금 나는 8080 항구로 달리고있다

언젠가는 이벤트를 끝내고 싶다 너를 위해 모든 것을 필요로한다 시험 뱀파이어 또는 그와 비슷한 것이 필요하다 언제 당신이 정적 파이썬 파이썬 코드에있는 파일들 파이썬 코드를 실행하면됩니다 정적 파일도 실행합니다

크롬을 열어 내가 말할거야 localhost 8080 이것이 어떻게 동작하는지 보자 그리고 re는 이것을 만들고있는 것처럼 보입니다 비디오와 리치는이 비디오를 이렇게 만드는 것입니다 기본적으로 무엇을합니까? 단어 반복 횟수 시어는 두 번 반복된다

비디오 두 번 반복하여 두 번 반복해서 이건 두 번이고 또한 당신은 내가 옵션을 필터링하는 것 같아 나는 이것에 의지 할 것이다 새로운 옵션은 다음에서 사용할 수 있습니다 그래서 이것은 실제 어플리케이션 I입니다 너를 보여 주려하고있어

내가 지금까지 설명 해놓은 전부 야 이게 전부 프론트 엔드 부분이다 그래서 이것은 B입니다 이것은 그러한 부분입니다 원하는 단어를 입력하는 곳 검색하려면 검색 엔진이 검색 부분이며 검색 부분입니다

이것이 응답 부분 웨이브 웨이브입니다 당신이 어떤 단어를 걸러 낼 때 나쁘다 단어가 화면 나누기에 나옵니다 이 부분은 필터 부분입니다 당신은에있는 모양을 볼 수 있습니다

이 코드에 github 및 분석 할 수 있습니다 그래서 이것은 메인 도트 HTML에 관한 것입니다 그래서 나는 당신에게 주요한 것을 보여줄 것입니다 컨트롤러는 스코프처럼 말합니다 달러 범위 도트 데이터 붙여 넣기 그 물건을 가져 가고 나는 호출되는 메소드 그것은 한 번 인수를 취한다

인수를 취한 다음 나는 단지 이것을이 서비스에 보낸다 나는 이것을 이것에 보내고있다 공장 공장은 공장이므로 내가 쓰는 것은 그렇게 함을 의미한다 내가 작성한 서비스 파일 자체 당신이 볼 수있는 공장이 앱입니다 내가 쓴 공장과 내가 할 공장 종속성으로 달러 HTTP 가져 오기 그래서 그리고 공장 이후 당신은 규칙을 안다

공장에 쓰려면 작성되었으며 API로 정의되어야합니다 또는 변수로 정의해야합니다 그 변수를 반환해야합니다 나는 그 객체를 가져 와서 추가하고있다 속성 및 데이터 전송 및 나는 정확한 범위를하고있어

완전한 웹 웹 파트 그래서 이렇게 나 내가 볼 백엔드 코드를 보여줄 것이다 병 프레임 워크를 사용 했나요? 이것은 매우 간단한 프레임 워크입니다 프로토 타입 및이 모든 것을 사용하는 당신이 전화를 걸 수 있다면 프레임 워크입니다 응용 프로그램을 매우 빠르게 사용하여 포털 그래서 내가 사용하는 이유입니다 이것을 호출하는 병 프레임 워크 시간 데코레이터와 이것이 어떻게 일단 우리가 쓸 함수는 우리가 이것을 정적 파일이라고 부르는 방식 정적 파일은 무엇이든지 각도 JS 코드 그래서 내가 가진 것은 무엇이든간에 쓰여진 것은 장식자가 언제 URL을 슬래시로 입력하면 슬래시가 발생합니다 중립적 인 정적 파일에옵니다

에있는 색인 도트 HTML 정적 파일 그래서 나머지 다음의 그때 나는 사물을 본다 카운트 단어는 당신이 볼 경우 단어를 카운트합니다 서비스 파일은 여기에서 카운트를 봅니다 내가 부르고있는 말들 나는 내가 몇 가지 데이터를 게시하고 있습니다 이 게시물 여기에 라우팅 밖으로입니다 작품들에 대해 설명해 드리겠습니다

나중의 수업에서의 전압은 이게 어떻게 작동하는지 보여 줘 이건 내가이 라우터에 포함 할거야 내가 게시 할 물 이 방법은 내용을 확인할 것이므로 게시물 방식이든 아니든간에 첫 번째 방법은 시체를로드합니다 얼굴 몸과 씻어 데이터 및 그 데이터를 나눠서 데이터를 봅니다 보내는 것도 내가 너에게 길을 보여 줄 것이다

당신이 볼 수 있다면 서비스 또는 서비스 파일 도트 GS 네 참조 나는 데이터의 객체 데이터를 보내고있다 그래서 내가 여기에 자료를 가져가는 이유입니다 그래서 여기 또한 데이터와 같습니다 그 열쇠를 기반으로 정확하게 나는 아래에있다 데이터를 가져 와서 일부 메서드는 반환하므로이 메서드는 이렇게 부르면이 방법이 기본적으로 그것은 세계와 그것을 세계의 수를 계산 한번 반복되면 그것은 반복됩니다

그 말을 듣고 내가 보낼거야 데이터가 너무 작게 설정하는 단어 기본적으로 어떤 데이터 및 반복되는 데이터의 수를 계산합니다 기본적으로 곰팡이가이 함수 상상해 보시라 세계의 시대 같은 것을 위해 실제로 쓰여졌습니다 내가 필요로하는 것은 팩과 같은이 프로젝트를위한 것입니다

세계 이름과 숫자를 계산 시간의 그것이 계산됩니다 그래서 그게 내가 쓸 이유 야 이처럼 반환하므로 내가 할 것처럼 반환 설정 이 목록에 대해 빈 목록을 정의하십시오 나는 태그와 같은 가치를 보내고있다 물은 내가 속이는 가치이기 때문에 추가 할 때마다 각각의 키를 추가합니다 열쇠와 가치 이 맞는 데이터를 반환합니다

나는 그걸 너에게 돌려주고있다 그냥 돌려 주겠다 나는 이제 막 돌아오고있다 그 데이터는 내가 돌아 오는 곳입니다 그래서 만약 당신이 볼 수 있다면 또한 브라우저에서 확인할 수 있습니다

내가 그렇게 될 것 인 브라우저를 조사해라 탭 하나 더 열면 내가 보여줄거야 그래, 네가 브라우저에서 열 수는 없어 데이터를 강제로 그것을 위해 양피지를 사용해야합니다 포어 맨을 사용하여 PABA를 보여 드리겠습니다

나중의 세션에서 너는 그렇게해야 해 데이터를 입력하면 JSON 형식으로 작성된 그래서이 두 가지가 막 얼어 붙었습니다 정적 콘텐츠를로드해야합니다 모든 CSS 파일을 반환하도록 작성했습니다 내가 사용한 이후 JavaScript 파일 정적 정적 컨텐츠 실행 백엔드 자체이므로 그래서 프레임 워크와 정적에 기반하여 사용하려고합니다

정적 파일의 내용로드 콘텐츠는 저장해야하는 위치에 따라 다릅니다 또는 어떻게 모든 것을 불러야하는지 당신은 프레임 워크에서 볼 수 있습니다 당신은 병 이것이 사용되는 방법이며 병입니다 단순하기 때문에 나는 또한 무언가가 있으면 좋아한다 오류와 같은 오류가 발생합니다

이 페이지가 유감스럽게 생각 나니 반가워요 존재하지 않기 때문에 이것은 모두 어떻게 당신이 알아야 할 프레임 워크 이 데코레이터를 어떻게 알 수있는 프레임 워크 이 때 언제 작동하면 언제 400 통화료를내는 방법은 모두 당신입니다 프레임 워크 측면에서 알 필요가 있으므로 나는 이것이 프레임 워크 측면이기도하다 기본적으로 대부분은 로컬 호스트 및 포트와 동일합니다 여기서 포트 번호를 다음과 같이 정의했습니다

잘 그래서 나는 너에게 완전한 실제로 응용 프로그램이 작동하도록 설정 하나의 커다란 반응 때문에 응답 및 처리중인 응답 여기 주 컨트롤러에서 볼 수 있습니다 도트 응답은 다음과 같습니다 얻으려고하는 데이터에 응답하라 여기에 오류가 지속되면 이것이 진행됩니다 사람이없는 경우 실행 이게 계속 될거야

응답이라는 변수를 선언했습니다 나는 메인 닷 (dot)에서 이것을 사용하고있다 HTML CNG 일부 응답이 오면 응답해야합니다 그러면 단어의 가장 작은 것을 얻을 것입니다 물론 검색 창과 당신은 검색 창을 얻을 것입니다

당신이 목록을 얻을 것이다 테이블 너에게서 돌아 오는 단어들 이것은 this this 변수입니다 데이터가 서비스에서 온 것입니다 사용할 수 있습니다 주 도트를 사용하고 있습니다 HTML과 나는 그것을 반복하고있다

베이스에 근거하는 키에 근거하고있다 요구 사항에 그냥 필터링 오전 데이터를 표시하고이 데이터를 표시하므로 전체 신청서를 보면 이것이 어떻게 작동하는지입니다 다시 한번 보여 드리겠습니다 B에 들어갈 때의 응용 프로그램 localhost 8080 이것이 첫 번째 방법입니다 크림이 오면 나는 기본적으로 반복 된 단어의 수를 보여준다 아일랜드어로 작성된 외장은 좋은 물건입니다

소년 나이트 엔지니어링의 엔지니어링 분야 애리조나 게리 빌 게리 너무 다윈 게리 게으른 제발 당신이 정말로 온다 Messala는 재료를 좋아한다 나는 방법을 모른다 여러 번 단어가 반복됩니다 제출을 눌러보고 볼 것입니다 쉬운 반복 두 번하고 싶어요

필터 만 사용 용이 C는 모두가있는 곳입니다 거기 그것이 보여줍니다 그래서 이것은 완전한 응용 프로그램은 사람들이 이해하기를 바랍니다 신청 절차 어떻게 작동합니까? 나중에 심도있게 설명한다 세션들 그러는 동안 나는 너를 나눌거야 너와 내 github 및 github 공유 계정 github 파일 세부 정보를 의미합니다

당신은이 따옴표를 모두 볼 수 있습니다 또한 웹 사이트에 이것을 배포했습니다 서버에있는 동안 나중의 세션에서 나는 어떻게 당신을 보여줄 것인가? 이 코드를 서버에 배포 할 수 있습니다 나도 너를 나눌거야 내가 배치 한 웹 사이트 URL 이 코드는 당신이 볼 수 있고 시도 할 수있다

이 예는 그렇습니다 github 및 볼 수있는 웹 사이트 URL 더 아래에서 공유 할 것입니다 그 길에서 모두가 등급을 매겨 주셔서 감사합니다