210303 HTML/CSS TIL - 키워드 작성완료(세부내용 작성 예정)

HTML/CSS

HTML/CSS 일곱번째 수업

오늘은 HTML/CSS 일곱번째 수업날이었다. 오늘도 많은 유익한 내용들을 배울 수 있던 날이었다.


이번 HTML/CSS 수업이 끝난 다음에 회고록을 작성해보도록 하자.

Animation 설계/디자인하기

MDN/MSDN 공식 문서 찾아보는 습관 들이기

MDN/MSDN 공식 문서 찾아보는 습관 들이기

가상 클래스의 사용(:focus와 :hover)

Read More

(Feedback)반응형 네이버 로그인 페이지 구현 및 웹 표준 & 접근성에 기반한 취약점 분석 및 개선안 적용

피드백

프로젝트 Repository : https://github.com/LeeHyungi0622/responsive-naver-login-page-with-web-standards-and-accessibility

이번 3.1절 연휴때 했던 과제에 대해서 어제(03월 02일) 데레사 강사님으로부터 피드백을 받았다. 어제 속이 별로 안좋아서 밥을 안먹고 있다가 마침 강사님이 계셔서 과제에 대한 피드백을 부탁드렸었는데 흔쾌히 해주시겠다고 하셔서 너무 감사했다. 쉬셔야 되는 시간인데 이렇게 소중한 시간을 내주셔서 피드백을 주신 강사님께 다시 한 번 감사의 말씀을 드리고 싶다.

자 그럼 어제 받은 피드백에 관한 내용을 정리해보자.
과제를 수행하는 것도 중요하지만 받은 피드백을 통해 어느 부분이 개선이 필요한지 파악해서 내 것으로 만드는 것이 중요하다.


(화면 설계 및 개발 관련 피드백)


  • main 태그 내부의 form 태그

    main 태그에 바로 form 태그를 넣어줘도 되지만, form 태그를 section이나 div 태그로 한 번 감싸서 넣어주도록 하자. 그리고 main 태그에 heading 태그를 넣어서 주도록 하자.

Read More

210303 Self Development TIL

Thought of the day

실패한 고통보다 최선을 다하지 못했음을 깨닫는 것이 몇배 더 고통스럽다.
- 앤드류 매튜스


TO DO LIST

  • HTML/CSS 메인강의

    • 강사님한테 받은 과제 관련 피드백 내용 정리하기 (블로그 포스팅) (완료)

    • 작성했던 README.md 파일에 strike mark 처리해서 수정한 내용 반영하기 (예정)

    • 3일 분 배운내용에 대해서 HTML/CSS TIL 포스팅하기 (진행중 - 키워드 작성 완료)

    • 강사님한테 받은 Figma 시안 과제 추가작업 (예정)

      • 표준 & 접근성 검사 및 수정 (예정)
    • inline, block, inline-block에 대해서 글 포스팅하기 (예정)

    • flex관련 글 포스팅하기 (예정)


  • Jest

    • 공식 사이트에서 단위 테스트 시나리오 작성하는 방법 찾아보기
      최근 현업에서 시나리오를 기반으로 단위 테스트 케이스를 작성하고, 만약 해당 테스트 케이스가 기대하는 동작과 다른 경우에는 작성한 테스트 케이스를 수정하는 방식으로 진행을 한다.
    • 강좌 중에서 테스트 주도 방식으로 진행하는 강좌가 있는지 찾아보기

    Read More

210302 HTML/CSS TIL - 레이아웃 구성 순서, 태그 배치도를 그릴때는 태그의 특성이 보이게 그리기, 요소배치는 최대한 논리적 순서를 유지한 상태에서 하기, figure 태그, anchor 태그의 대체 텍스트, :root{}를 활용한 스타일 속성의 변수선언(재사용성), CSS 전처리기의 종류 및 장/단점, 실무에서의 스타일링 방법, positioning에 따른 element의 성격 변화, rgba()와 hsla()의 사용법, 1px보다 얇은 디자인, 스프라이트 기법 (CSS Sprites), aria-label과 IR 기법

HTML/CSS

HTML/CSS 여섯 번째 수업

오늘은 HTML/CSS 여섯 번째 수업날이었다. 오늘도 많은 유익한 내용들을 배울 수 있던 날이었다. 이 모든 것들을 내 것으로 만들기 위해 끊임없이 노력하자.

레이아웃 구성할 때는 콘텐츠의 논리적 순서 흐름을 파악하고 나서 구체적인 태그의 배치(시맨틱 마크업)를 고려한다.

이 내용에 대해서는 HTML/CSS 수업 초반에 강사님께서 강조해주셨던 내용이다. 지금은 개인적으로 레이아웃 설계 연습을 할 때도 항상 되뇌이면서 연습을 하고 있다. 오늘 이 부분에 대해서 강사께서 어쩌면 실무에서 일을 하면서 이러한 콘텐츠의 논리적 순서를 고려하지 않고 레이아웃을 단순 디자인적 관점에서 보게 될 수도 있고, 상황에 따라서는 타협을 해야 될 때가 온다고 하셨다. 이럴때에는 최소한의 접근성을 고려해야 되는 요소만은 지켜서 레이아웃을 설계하면 된다고 하셨다.

콘텐츠의 논리적 순서 → 시맨틱 마크업 → Class 네이밍

Read More

Baekjoon Online Judge 17609번 회문/유사회문 문제 (다각도에서 문제 바라보기)

백준 저지 17609번 회문/유사회문 문제 Pseudo code + Python code

문제풀이 접근 방식 : 재귀호출

Pseudo code #1 RecursionError

본 코드 #1

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
shift_flag = False


def palindrome(input_str):
global shift_flag
if len(input_str) <= 1:
if shift_flag:
return 1
return 0

if input_str[0] != input_str[-1]:
if input_str[0] == input_str[-2]:
shift_flag = True
input_str = input_str[0:-1]
elif input_str[1] == input_str[-1]:
shift_flag = True
input_str = input_str[1:]
else:
return 2

return palindrome(input_str[1:-1])


n = int(input())
for _ in range(n):
input_str = input()
print(palindrome(input_str))

Read More

210302 Self Development TIL

Thought of the day

실패한 고통보다 최선을 다하지 못했음을 깨닫는 것이 몇배 더 고통스럽다.
- 앤드류 매튜스


TO DO LIST

  • HTML/CSS 메인강의

    • 강사님한테 받은 Figma 시안 과제 추가작업

      • 표준 & 접근성 검사 및 수정 (예정)
    • inline, block, inline-block에 대해서 글 포스팅하기 (예정)

    • flex관련 글 포스팅하기 (예정)


  • 백준 알고리즘 문제풀기

    • 백준 알고리즘 17609번 회문 문제풀이 (완료)
      • Pseudo code 작성하기 (완료)
      • 본 코드 작성하기 (완료)
      • 블로그에 업데이트 (완료)

    Read More

210301 Self Development TIL

Thought of the day

실패한 고통보다 최선을 다하지 못했음을 깨닫는 것이 몇배 더 고통스럽다.
- 앤드류 매튜스


TO DO LIST

  • HTML/CSS 메인강의

    • 강사님한테 받은 Figma 시안 과제하기 (완료)

      • 로그인 상태 유지 및 IP 보안 ON/OFF 체크박스 수정하기 (완료)
      • 개선안 3을 위한 CSS 이벤트 처리관련 조사 및 구현 (완료)
      • 반응형 웹 페이지 구현하기 (완료)
      • Project Reflection 작성하기 (완료)
    • HTML/CSS 테스트 문제풀기 (완료)

    • inline, block, inline-block에 대해서 글 포스팅하기 (예정)

    • flex관련 글 포스팅하기 (예정)


    Read More

210329 Self Development TIL

Thought of the day

실패한 고통보다 최선을 다하지 못했음을 깨닫는 것이 몇배 더 고통스럽다.
- 앤드류 매튜스


TO DO LIST

  • 백준 알고리즘 문제풀기

    • 기본 알고리즘 문제 10문제 풀이 (예정)
  • 블로그 포스팅

    • Event capturing / Event bubbling 관련 블로그 글 포스팅하기(+이벤트 위임) (완료)
    • Closure 에 대해서 공부하고 블로그 포스팅하기 (예정)

Read More

210228 Self Development TIL

Thought of the day

실패한 고통보다 최선을 다하지 못했음을 깨닫는 것이 몇배 더 고통스럽다.
- 앤드류 매튜스


TO DO LIST

  • HTML/CSS 메인강의

    • 강사님한테 받은 Figma 시안 과제하기 (진행중)

      • 세부 Task작업으로 나눠서 작성하기 (완료)
      • #1 - #5 Task (완료)
    • inline, block, inline-block에 대해서 글 포스팅하기 (예정)

    • HTML/CSS 테스트 문제풀기 (예정)

    • flex관련 글 포스팅하기 (예정)

    • 이중 float 복합예제 찾아서 연습하기 (예정)

      Read More