홍준혁

저번에 레이아웃을 설계했으니까 이번에는 메인화면을 꾸며보는 작업을 할것이다. 먼저 해볼것은 header에 로고를 넣는 작업을 할것이다. 하지만 우리의 로고는 아직 정해진것이 없기때문에 그냥 임의의 로고를 넣기로 했다.(텍스트) 이제 프로토타입을 보면 백그라운드가 조금 회색계열인것을 볼 수 있다. 그래서 색을 바꾸는 작업을 하겠다. 폰트도 바꾸는 작업을 했다. (폰트는 아직 정해진것이 없기때문에 임의로 설정을 해주었다. ※폰트는 Jua폰트이다.※) 그다음 content에 제목을 꾸며주는 작업을 진행하였다 border-bottom값을 줘서 제목과 내용을 나누었고 font-size값을 증가시켜서 글씨가 눈에 더 잘 보이게 꾸몄다 그리고 이모지를 넣어 더 꾸며주었다 (나중에 사진으로 대체할 예정이다.) 오늘은 ..

저번에 로그인폼을 만들었으니 이제 로그인 버튼을 누르면 메인화면으로 이동할 수 있도록 코드를 작성하였다. 먼저 Vue를 이용해서 새로고침을 방지하는 코드를 작성하였고 methods에 메인화면으로 이동하는 코드를 추가해 주었다. new Vue({ el: ".login_wrap", methods: { goto_main() { window.open("/main/main.html", "_self"); }, }, }); 이 goto_main을 v-on:submit.prevent="goto_main" submit이벤트가 발생할때 새로고침을 방지하는 prevent수식어를 사용하고 goto_main의 함수를 실행하라는 내용이다. 그래서 로그인 버튼을 누르면 ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓ 위에 메인화면은 설계..

저번 시간에 이어 디자인을 조금 다듬고 기능 구현을 해볼 것이다 팀 회의결과 남여정보도 받도록 결정났다. 그래서 radio태그를 사용해서 기능을 구현하도록 하겠다. 조금 더럽지만 html코드를 공개하겠다 이름 이메일 비밀번호 기수 1기 2기 3기 4기 5기 성별 남 여 이제 어느정도 로그인 폼을 구현했으니 로그인 화면을 구현해보도록 하겠다.

학교 동아리인 바인드에서 팀 프로젝트를 진행하기로 했다. 일정관리 프로그램인데 프로젝트에서 로그인 기능을 구현하는 게 가장 먼저 해야겠다는 생각이 들어서 로그인 기능을 한번 구현해 보려고 한다. 먼저 간단한 로그인 코드 HTML만 구현해 보면.. 아이디: 비밀번호: 회원이 아니신가요?회원가입 이런 식으로 입력만 가능하고 제출할 수 있는 기능은 넣지 않았다. 그리고 회원가입 사이트에서 받는 회원의 정보는 이름 / 이메일(학교 이메일 계정, 아이디) / 비번 / 기수 선택 이렇게 입력을 받는다. 간단한 signUp, html 코드를 작성해 보면 이름 : 이메일: 비밀번호: 기수: 1기 2기 3기 4기 5기 이런 식으로 설계를 했다. ※아직 초기 설계이고 나중에 변할 수 있습니다. 일단 css로 간단한 디자인..