❓ BYlog 란?

BYlog의 컨셉은 private 블로그다. 로그인하지 않으면 다른 블로그를 둘러볼 수 없고 로그인하더라도 해당 블로그의 코드를 모르면 진입할 수 없다.

이를 통해 사용자는 개인 다이어리처럼 BYlog를 활용할 수 있고 본인이 원하는 사람들에게만 블로그코드를 알려줘 서로 교류할 수 있다.

한마디로 내가 허락한 사람만 들어올 수 있는 개인블로그이다.

💡 ToDos

• 메인화면은 로그인화면 (23.06.14)
• 회원가입 시 블로그코드 입력 (23.06.14)
• 로그인 시 개인블로그로 이동 (23.06.14)
• 이동하려는 블로그코드를 입력하면 해당 블로그로 이동할 수 있는 기능 구현
• 게시판
• 게시글 공개/비공개 설정 가능
• 게시글 검색
• 게시글 목록 페이징
• 방명록
• 댓글 기능
• 프로필 사진 설정
• 블로그 소개글 (23.06.14)
• 관리자페이지 (23.06.14)
• 회원정보수정

💻 시작!

✔ User 데이터베이스

회원가입 시 username, email, password, 블로그코드를 입력받게 했고 프로필 이미지와 소개글은 기본으로 설정해주고 추후 회원정보수정에서 변경 가능하게 하려한다.

✔ 회원가입

@bp.route('/signup/', methods=('GET', 'POST'))
def signup():
    form = UserCreateForm()
    if request.method == 'POST' and form.validate_on_submit():
        user = User.query.filter_by(email=form.email.data).first()
        key = User.query.filter_by(private_key=form.private_key.data).first()
        if not user and not key:
            user = User(username = form.username.data,
                        password = generate_password_hash(form.password1.data),
                        email = form.email.data,
                        private_key = form.private_key.data,
                        introduction = f'환영합니다. {form.username.data}의 BYlog입니다.')
            db.session.add(user)
            db.session.commit()
            return redirect(url_for('auth.login'))
        elif user and key:
            flash('이미 존재하는 이메일입니다.')
            flash('이미 존재하는 블로그코드입니다.')
        elif key:
            flash('이미 존재하는 블로그코드입니다.')
        elif user:
            flash('이미 존재하는 이메일입니다.')
    return render_template('auth/signup.html', form=form)

회원가입 시 이메일과 블로그코드가 기존 회원과 겹치지 않는지 검사하고 이상이 없으면 데이터베이스에 입력되게 했다.

아직 기능구현 전이지만 동일한 블로그코드가 여러개일 경우, 블로그코드를 기준으로 타인 블로그에 진입하기가 어려울 것 같아 블로그코드도 검사하게 만들었다.

비밀번호는 generate_password_hash를 통해 암호화해서 데이터베이스로 넘겨줬다.

이상없이 회원가입이 완료되면 로그인페이지로 리디렉팅된다.

✔ 로그인

BYlog에 처음 접속하면 만날 메인화면이다.
비회원은 회원가입 버튼을 통해 회원가입폼으로 이동할 수 있다.

회원은 로그인 시 본인 블로그로 이동하게 만들었다.

각각 블로그로 이동하는움짤

@bp.route('/login', methods=('GET','POST'))
def login():
    form = UserLoginForm()
    if request.method == 'POST' and form.validate_on_submit():
        error = None
        user = User.query.filter_by(email = form.email.data).first()
        if not user:
            error = '존재하지 않는 사용자입니다.'
        elif not check_password_hash(user.password, form.password.data):
            error = '비밀번호가 올바르지 않습니다.'
    if error is None:
        session.clear()
        session['user_id'] = user.id
        return redirect(url_for('main.bylog',id=user.id))
    flash(error)
    return render_template('auth/login.html', form=form)

가장 먼저 사용자가 입력한 이메일이 User 데이터베이스에 있는지 검사하고 이후 비밀번호를 검사해서 이상이 없으면 로그인이 되고 검사과정에서 문제가 있으면 관련 error를 flash해준다.

이상없이 로그인이 되면 세션에 해당 사용자의 ID값이 저장되고 메인페이지로 리디렉팅된다.

메인페이지로 넘어갈 때 로그인한 사용자의 ID를 받아 url에 합쳐 각각 다른 블로그 주소로 이동하게 만들었는데, 그렇게 만들어 놓고 보니 아무나 주소에 다른 ID값을 입력해서 해당 블로그로 이동할 수 있게 됐다.

물론 비로그인 상태에서도 주소창에 해당 블로그 url을 입력하면 진입이 가능했다.

이 문제를 해결하기 위해 세션을 이용하기로 했다.

if id == session['user_id'] :
  return render_template('main/base.html',user=user)
elif 'user_id' in session :
  return redirect(url_for('main.bylog', id=session['user_id']))
else :
  return redirect(url_for('main.index'))

url입력 시 세션에 저장된 user_id와 라우팅 함수가 받은 id값이 다르면 메인 라우팅 함수에 세션에 저장된 user_id를 id값으로 넘겨 본인 블로그로 리디렉팅되게 했다.
else로는 비로그인 사용자로 판단해 로그인페이지로 리디렉팅되게 만들었다.

상기 코드를 저장해서 실행하니 처음엔 잘되는것처럼 보였는데, 비로그인 상태에서 에러가 발생했다.

비로그인 상태일 때 세션을 이용하는데서 에러가 발생해서 해당 부분을 try/except로 바꿔주니 해결되었다.

try:
        if id == session['user_id'] or session['user_id'] == 1:
            return render_template('main/base.html',user=user)
        elif 'user_id' in session:
            return redirect(url_for('main.bylog', id=session['user_id']))
except:
        if 'user_id' not in session:
            return redirect(url_for('main.index'))

로그인 시 각자의 ID에 맞는 블로그 주소로 리디렉팅 되어 회원들이 각자가 이용할 수 있는 블로그 공간을 만들어줬다.

url을 통해 다른 블로그로 접근하려 할 때, 본인 블로그로 리디렉팅 되게 하여 각 블로그의 프라이버시도 지켜낸 것 같다.

처음 생각했던 컨셉에 비슷한게 만들어지고 있구나하고 처음 느낀 순간이다😎

✔ 헤더

헤더는 템플릿태그를 이용해서 비로그인 시 로고만 보이게 하고 로그인하면 다른 버튼들이 보이게 했다.

관리자로 로그인 하면 회원관리 버튼도 구현되게 만들어놨다.

{% if session['user_id'] %}

🛠 관리자

BYlog의 관리자페이지다. User 데이터베이스에서 유저 정보를 불러와 표로 띄워주고 있다.

관리자는 사실 처음 BYlog를 구상할 때는 만들 생각을 못했었는데, 데이터베이스에서 직접 데이터에 손댔다가 몇번 날려먹고 필요하다 싶어서 만들게 됐다.

뒤늦게 만들다보니 관리자 권한 설정하는 기능이 따로 없어 라우팅 함수쪽에 손대서 관리자 ID는 모든 화면에 라우팅될 수 있게 만들었다. 앞으로 만드는 화면들에도 같은 방식으로 적용해 줘야할 것 같다. 관리자 권한 설정하는 건 일단 1차적으로 완성하고 리팩토링 하면서 다시 만져줘야할 것 같다. 일을 사서하는 타입..?

일단 현재로는 본인만 들어갈 수 있게 만든 페이지에 관리자도 들어갈 수 있게 해놔서 회원관리도 해당 회원 회원정보수정 화면으로 링크를 걸어놨다. 아직 회원을 강퇴할 수 있는 기능이 없는데, 회원정보수정에서 탈퇴기능을 만들지 관리자페이지 자체에서 정보 삭제 기능을 만들지 고민중이다.

회원관리페이지는 이렇게까지 기능을 넣을 생각이 없었는데 하다보니 페이징도 하고 검색 기능도 만들었다.

if kw:
        search = '%%{}%%'.format(kw)
        user = db.session.query(User).filter(User.username.ilike(search) |
                    User.email.ilike(search) | 
                    User.private_key.ilike(search))
    user = user.paginate(page=page,per_page=25)

kw 값을 get방식으로 받아 해당 문자열을 username,email,블로그코드에 포함하고 있는 레코드를 화면에 띄워주는 방식으로 검색기능을 만들었다.

페이징은 한 페이지 당 25명의 회원정보를 보여주게 만들었는데, 회원이 25명이 넘는날이 올랑가.. 기능자체는 per_page=1로 조정해서 정상작동하는 건 다 확인했는데 막상 만드니 해봤자 회원이 몇명이나 된다고 이 고생을 했는지..

🛠 블로그 메인화면

메인화면 구상할 때 그린 그림이다.
메인화면은 아직 구현 중이라 좀 더 볼게 생기면 사진 올리는걸루..

현재는 소개란에 User 데이터베이스에서 블로그 주인의 이름과 소개글을 가져와 띄워주게 만들어놨고 헤더쪽만 구현이 되어있다.

🛠 회원정보수정

회원정보수정 페이지다. User 데이터베이스에서 해당 사용자정보 받아와서 띄워주는 것까지는 만들었는데, 아직 실제로 수정되진 않는다. 원래 로그인 완성하고 바로 정보수정 만지기 시작한 것 같은데, 프로필사진 넣는게 생각보다 복잡복잡해서 다른쪽 먼저 기웃거리고 있다...

📃 오늘은 여기까지

책에서 하라는데로 실습만 해봤지 직접 만드는건 처음인게 많아 힘들긴하지만 그만큼 뭔가 구현해냈을 때 성취감이 있는 것 같다. 만들면서 이런 부분은 더 공부해야겠구나 하는게 계속 늘는게 문제 아닌 문제랄까..ㅎㅎ 내일까지 기능적인건 끝내고 주말에 프론트쪽 좀 만지고 배포할 계획이였는데 지금 시간보니 될까싶기도 하지만..

해내야지 어쩌겠습니까!

그럼 오늘은 20000, 다음 포스팅 땐 완성된 BYlog를 보여드릴 수 있길..!