본문 바로가기

[001] 웹디자이너 사전지식 체크_1 너웹디 A. 사전지식 1. 인터넷을 실행하는 프로그램은? 웹브라우저(Web browser)는 인터넷망에서 정보를 검색하는 데 사용하는 응용 프로그램을 말한다. 브라우저 혹은 인터넷 브라우저라고 부르기도 한다. 이를 통해 사용자들은 영상을 보거나 메일을 주고 받고 다양한 자료를 올리고 내려 받는 등 다양한 활동이 가능하다. 일반적인 기능으로는 웹 페이지 열기, 최근 방문한 인터넷 주소(URL) 및 즐겨찾기 제공, 웹페이지 저장 기능 등이 있다. 2. 웹브라우저의 종류는? ⓐInternet Explorer(인터넷 익스플로러) ⓑChrome(크롬) ⓒFirefox(파이어폭스) ⓓSafari(사파리) ⓔOpera(오페라) 3. html [Hypertext Markup Language] 이란 무엇 인가요? 웹 문.. 더보기
[수퍼.D.파티] 웹디자인기능사 필기 2006년 5회 오답노트 분석 안녕하세요?? 이제 영어쌤을 한지도 3년이 넘어가네요!! 사업의 발판중 하나로 웹디자인 및 퍼블리싱을 체계적으로 한번 잡기 위해 교육을 받는 중입니다. 그 중 하나로써 웹디자인 기능사 자격증을 취득하려 하는데요. 먼저 필기 시험을 볼 것 이기 때문에 이번엔 시험을 보고 스스로 리뷰를 할 것 입니다~!!! Let me move!! ============================================================================ 웹디자인기능사 필기(모의고사) (2006년 5회 기출문제) 오답노트 1. 다이렉트 메일의 종류 중 노벨티(novelty)의 예를 하나 들어봐요. 점답: B. 상품명이나 상점 이름이 들어 있는 수건, 재떨이, 라이터 등 # 노벨티(novelty란.. 더보기
(7.4) Frontend Authentication_ 영어쌤이 만드는 회원가입, 인증[CRUD] 만들어욤! 리액트와 파이썬 장고 (7.4) Frontend Authentication_ 영어쌤이 만드는 회원가입, 인증[CRUD] 만들어욤! 리액트와 파이썬 장고 안녕하세요? 죠니입니다. 이제 진짜 마지막의 마지막에 다가왔군요. - 인증받은 계정으로 로그인 시에만 새로운 데이터를 생성하고 관리하는 것이 가능해 지도록 하는 작업을 할 차례입니다. - 시간 끌지 말고 바로 해볼까요? (25) /src/actions/leads.js - lead action을 조금 수정합니다. - action의 auth.js 파일에서 token config function이 있습니다. 그것을 leads로 가져옵니다. - token 을 얻기 위해 다음과 같이 dispatch와 함께 getState를 줍니다. - 결과 확인 - 새로고침을 해 보면 - 프로젝트 내.. 더보기
(7.3) Frontend Authentication_ 영어쌤이 만드는 회원가입, 인증[CRUD] 만들어욤! 리액트와 파이썬 장고 7장 Frontend Authentication 안녕하세요? 죠니입니다. 이번 7.3은 로그인 시 메세지 출력 부터 시작하겠습니다. (12) /src/components/layout/Header.js - Header.js 파일에 다음과 같이 코드를 작성합니다. - 음... 코드를 작성하기 전에 제가 예상했던 메세지와는 조금 다르지만, 이것도 확실히 쓸모가 있습니다. - 다음의 결과화면과 같이 로그아웃 버튼의 좌측에 Welcome 메세지가 발생되어 있고 user name이 있어 어떤 계정으로 인증을 받았는지 알 수 있습니다. (13) /src/actions/auth.js - auth.js 액션 파일의 가장 아래에 다음과 같이 코드를 추가 작성합니다. - logout user 부분의 다음의 블록지정된 코드를.. 더보기
(7.2) Frontend Authentication_ 영어쌤이 만드는 회원가입, 인증[CRUD] 만들어욤! 리액트와 파이썬 장고 7장 Frontend Authentication 안녕하세요? 죠니입니다. 이번 7.2 에선 지난 포스팅에 진행했던 로그인에 이어 로그아웃을 하도록 합니다. (5) /src/components/layout/Header.js - 먼저 UI를 보시면 로그아웃을 하는 링크는 보이지 않습니다. - 로그인 상태라면 로그아웃 버튼이 있어야 하고, 로그아웃 상태라면 로그인 버튼을 제공해 줍니다. - react redux와 proptypes를 가져옵니다. - 로그아웃을 구현하기 위한 코드 수정 및 추가 작성을 진행합니다. - 다음은 Register와 Login에 대해 작성되어 있던 의 코드를 모두 잘라냅니다.(ctrl + x) - 그리고 그 잘라냈던 코드는 다음에 붙여줍니다. - const guestLinks 를 새로 .. 더보기
(7.1) Frontend Authentication_ 영어쌤이 만드는 회원가입, 인증[CRUD] 만들어욤! 리액트와 파이썬 장고 7장 Frontend Authentication 안녕하세요? 죠니입니다. 이제 이번 React+Django+Redux Authentication의 마지막 주제가 되겠습니다. - Login Functionality(로그인 기능) - Login - get a token (토큰 발급 받기) - Token 확인이 되어 인증 받기 - Register - 회원가입 하기 바로 시작해 보겠습니다. (1) /src/actions/types.js - 로그인 성공, 로그인 실패에 대한 type 추가하기 - Code on Color Scripter (2) /src/actions/auth.js - auth.js 파일 내에 로그인 성공, 실패에 대한 코드를 추가합니다. - 5, 6번째 포스팅에서 진행했던 토큰에 대한 코드와 매우.. 더보기
(6.2) 권한주기(Auth State & Private Routes)_ 영어쌤이 만드는 회원가입, 인증[CRUD] 만들어욤! 리액트와 파이썬 장고 (6.2) 권한주기(Auth State & Private Routes)_ 영어쌤이 만드는 회원가입, 인증[CRUD] 만들어욤! 리액트와 파이썬 장고 안녕하세요? 죠니입니다. 바로 시작할게요! - 아직까진 Add Lead(data 생성)과 Lead list(data list) 페이지가 숨겨지지 않고 전면에 공개되어 있습니다. 있어서는 안될 일이죠. - 그래서 당연하지만 인증 받은 계정으로 접속시에만 해당 기능이 가능한 페이지로 넘기도록 작업을 할 것 입니다. (10) Lead data 생성 화면 숨기기 입니다. 시작! (10) /src/components/common/PrivateRoute.js 파일 생성 및 작성 - Lead data 생성 및 리스트 페이지 숨기기 // 권한을 가진 계정만 접근 가능 - .. 더보기
(6.1) 권한주기(Auth State & Private Routes)_ 영어쌤이 만드는 회원가입, 인증[CRUD] 만들어욤! 리액트와 파이썬 장고 (6.1) 권한주기(Auth State & Private Routes)_ 영어쌤이 만드는 회원가입, 인증[CRUD] 만들어욤! 리액트와 파이썬 장고 안녕하세요? 영어쨈 죠니 입니다. 저번 포스팅에선 백엔드에서 토큰을 발급받고 이를 활용해 로그인 등을(백엔드 에서) 구현하는 법과 등록, 로그인 그리고, 토큰을 받고 해당 토큰을 이용하여 보호된 루트들로 접근하는 것을 알아보았습니다. 이번 포스팅에선 로그인, 등록 컴포넌트들로 Interface에 띄울 수 있게 하고, react router를 설치하고, 인증 권한에 따른 페이지 접근 등을 알아봅니다. 로그인을 해야만 서비스 페이지에 접근 및 서비스를 이용 가능하게 하는 것과 같습니다. - 인증 받은 예정으로 접근해야만 다음의 페이지에 접근해 이후 작업을 진행할.. 더보기
(5.3) 장고 토큰 인증- 로그인 구현하기_ 영어쌤이 만드는 회원가입, 인증[CRUD] 만들어욤! 리액트와 파이썬 장고 (5.3) 장고 토큰 인증- 로그인 구현하기_ 영어쌤이 만드는 회원가입, 인증[CRUD] 만들어욤! 리액트와 파이썬 장고 - 이번엔 로그인을 구현하여 작동하고 있는 Authentication에 적용하도록 합니다. (11) /leadmanager/accounts/serializers.py || Validation(인증) 코드 작성 작업 - 다음과 같이 #Login Serializer 및에 인증 기능을 하는 serializer를 만들어 줍니다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 // /leadmanager/account/serializers.py from res.. 더보기
(5.2) 장고 토큰 인증(Django Token Authentication)_ 영어쌤이 만드는 회원가입, 인증[CRUD] 만들어욤! 리액트와 파이썬 장고 (5.2) 장고 토큰 인증(Django Token Authentication) 안녕하세요? 죠니입니다. 지난 포스팅의 마지막에 언급했던 것을 다시 상기시켜 봅니다. 이제 우리에게 필요한 것은 인증을 하도록 해 주는 것 입니다. 그렇게 하기 위해 이제 할 일은 1. Registration(등록) API 만들기: 계정 생성을 위함 2. Login API 만들기 3. TOKEN - 그리고 우리가 로그인을 할 때 장고 서버로부터 토큰을 받게 될 것 입니다. - 토큰을 받으면 받은 토큰을 header들과 함께(또는 headers 로부터) 보냅니다. - 그렇게 하면 lead를 추가, fetch(호출)과 같은 것들을 할 수 있습니다. 결론은 토큰을 받는 인증 플로우를 만들어 주는 것 입니다. 그러면 바로 시작해 볼까.. 더보기