분류 전체보기 (35) 썸네일형 리스트형 [Back] 게시글 좋아요 기능 만들기 - 4. 초기화면 로그인 여부에 따라 다르게 구성하기 안녕하세요 주갬입니다! 벌써 네번째 글이네요! 잘 따라와주신 모든 분들께 감사합니다 2021.05.25 - [Laravel Blog] - [Front] 게시글 좋아요(Like / Dislike) 기능 만들기 - 1. 뷰 만들기 [Front] 게시글 좋아요(Like / Dislike) 기능 만들기 - 1. 뷰 만들기 안녕하세요 주갬입니다! 오늘은 라라벨 블로그의 좋아요 기능을 구현하면서 여러분들께도 설명드리려고 합니다. 저는 다음과 같이 좋아요와 싫어요가 모두 있는 유튜브의 좋아요 기능을 구현 joogaem.com 2021.05.26 - [Laravel Blog] - [Back] 게시글 좋아요 기능 만들기 - 2. 데이터베이스 설계 [Back] 게시글 좋아요 기능 만들기 - 2. 데이터베이스 설계 안녕하세.. [Back] Laravel Middleware - Auth (1) 안녕하세요, 주갬입니다. 오늘은 Laravel의 미들웨어에 대해 Auth를 중심으로 설명드리려고 합니다. 사실 미들웨어는 Laravel에서만의 기능은 아니고 굉장히 보편적으로 쓰이는 기능입니다. Redhat의 공식문서에서는 미들웨어를 다음과 같이 설명하고 있습니다. 미들웨어는 공통 서비스 및 기능을 애플리케이션에 제공하는 소프트웨어입니다. 데이터 관리, 애플리케이션 서비스, 메시징, 인증 및 API 관리는 주로 미들웨어를 통해 처리됩니다. 미들웨어는 개발자들이 애플리케이션을 보다 효율적으로 구축할 수 있도록 지원하며 애플리케이션, 데이터 및 사용자 사이를 연결하는 요소처럼 작동합니다. https://www.redhat.com/ko/topics/middleware/what-is-middleware 미들웨어.. [CSS] selectors & display CSS기초를 다지고 있는 주갬입니다. 오늘은 Selector의 종류와 display, position에 대해 알아보겠습니다. selector의 종류 Universal * type Tag ID #id Class .class Attribute [] 가상 클래스 :hover -> 해당 요소에 마우스를 올리면 동작하는 CSS button:hover { color: red; background: beige; } Display 이해하기 기본적으로 우리가 사용하는 Tag 에는 block요소와 inline요소가 있습니다. inline: 전후 줄바꿈 없이 한 줄에 다른 엘리먼트들과 나란히 배치. -> inline 엘리먼트: , , -> width, height 속성은 무시 -> 해당 태그가 마크업하고 있는 컨텐츠의 크기.. [HTML, CSS 기초 쌓기] HTML 문서 유효성 검사 툴 소개 안녕하세요! HTML, CSS의 기초를 공부하고 있는 주갬입니다. 오늘은 HTML을 공부하실 때 유용한 사이트를 소개해 드리려고 합니다. HTML은 마크업 언어로 정해진 문법에 따라 문서의 구조를 표현합니다. 마크업 언어(markup 言語, markup language)는 태그 등을 이용하여 문서나 데이터의 구조를 명기하는 언어의 한 가지이다. 태그는 원래 텍스트와는 별도로 원고의 교정부호와 주석을 표현하기 위한 것이었으나 용도가 점차 확장되어 문서의 구조를 표현하는 역할을 하게 되었다. 이러한 태그 방법의 체계를 마크업 언어라 한다. _wiki 이 사이트는 작성된 HTML 문서가 마크업언어의 문법에 맞게 쓰여졌는지 유효성 검사를 해주는 사이트로, HTML 공부를 할 때 유용하게 쓰실 수 있습니다. ht.. [Back] 게시글 좋아요 기능 만들기 - 3. 모델과 마이그레이션 안녕하세요 주갬입니다~ 게시글 좋아요 기능을 이어서 포스팅 하도록 하겠습니다. 어제에 이어 데이터베이스에 대한 설명입니다. 2021.05.25 - [Laravel Blog] - [Front] 게시글 좋아요(Like / Dislike) 기능 만들기 - 1. 뷰 만들기 [Front] 게시글 좋아요(Like / Dislike) 기능 만들기 - 1. 뷰 만들기 안녕하세요 주갬입니다! 오늘은 라라벨 블로그의 좋아요 기능을 구현하면서 여러분들께도 설명드리려고 합니다. 저는 다음과 같이 좋아요와 싫어요가 모두 있는 유튜브의 좋아요 기능을 구현 joogaem.com 2021.05.26 - [Laravel Blog] - [Back] 게시글 좋아요 기능 만들기 - 2. 데이터베이스 설계 [Back] 게시글 좋아요 기능 만.. [Back] 게시글 좋아요 기능 만들기 - 2. 데이터베이스 설계 안녕하세요 주갬입니다~! 게시글 좋아요 기능을 이어서 포스팅 하도록 하겠습니다. 오늘은 데이터베이스 구성에 대한 설명입니다. 저는 좋아요 기능 관련 테이블의 컬럼을 다음과 같이 구성했습니다. id는 auto_increment 컬럼으로, 인덱스값으로 사용됩니다. board_no는 게시글의 id값을 저장합니다. user는 현재 로그인하고 있는 사용자의 id값을 저장합니다. like_no, dislike_no, check에 대한 설명은 밑에 상황별로 나누어 자세히 설명드리겠습니다. 1. 로그인 후, 페이지에 처음 들어가 아직 좋아요 싫어요를 누른 적이 없다면 ajax를 이용해 $(document).ready()에서 row를 생성해줍니다. -> 이 부분은 수정이 필요 1. 최초로 좋아요 / 싫어요를 선택 lik.. [Front] 게시글 좋아요(Like / Dislike) 기능 만들기 - 1. 뷰 만들기 안녕하세요 주갬입니다! 오늘은 라라벨 블로그의 좋아요 기능을 구현하면서 여러분들께도 설명드리려고 합니다. 저는 다음과 같이 좋아요와 싫어요가 모두 있는 유튜브의 좋아요 기능을 구현할 예정입니다. 좋아요만 있는 단순 기능에서 더 나아가 좋아요와 싫어요를 중복으로 선택할 수 없는 투표 시스템을 구현하고 싶었습니다. 1. View 저는 화면을 먼저 만들고 (어려운 부분부터 먼저,,ㅎ) 백단 코드를 붙이는 스타일이라 기존에 있던 포스팅 뷰 페이지를 열고 Like / Dislike 버튼을 만들었습니다. 저는 디자인 감각이 없기때문에 Codepen에서 열심히 예쁜 버튼을 찾아다녔습니다. 디자인에 자신 없으시다면 codepen에서 예제를 잘 찾아 적용하면 좋습니다. 제가 참고한 링크를 공유합니다. https://co.. Laravel 시간이 다르게 출력될 때 (timezone설정) 블로그의 포스트 작성 페이지를 만들던 중 시간이 현재시간과 다르게 출력된다는 사실을 깨달았습니다. 오류 메시지도 뜨지 않는데 이건 무슨 오류일까요?? 원인은 Timezone의 설정에 있습니다. config/app.php에 들어가 'timezone' => 'UTC'를 'Asia/Seoul'로 수정합니다. 결과 깔끔하게 현재 시간으로 출력이 잘 됩니다. Front) Laravel blade에 관한 설명 Laravel을 사용한다면 라라벨만의 view파일 형식인 blade에 관해 알아야 합니다. blade파일은 MVC패턴 중 View를 담당하고 있으며, Controller에서 보내준 PHP변수를 받아와서 사용도 가능하고 전용 문법을 이용해 기존 HTML코드에서는 JS를 이용해 구현해야 하는 반복문등도 사용할 수 있습니다. 라라벨의 blade문법에 관한 자세한 설명은 공식문서를 참고하시기 바라며 이 글에서는 간단하게 필수적인 문법만 설명드리려고 합니다. https://laravel.com/docs/8.x/blade 가장 많이 쓰는 문법 몇 가지만 소개하면 다음과 같습니다. 1. php 코드 작성 칸 {{ ~ }} route를 이용해 넘겨준 php변수나 facade를 이용한 작업을 할 때 {{ Auth::Us.. 라라벨 블로그 1. 파일매니저- Summernote에서 iziModal 사용하는 방법 안녕하세요! 라라벨로 블로그를 만들고 있는 주갬입니다~ 이번 시간부터 블로그의 파일 매니저를 구성하는 방법에 대해 설명드릴 예정입니다! 블로그를 만들 때 에디터의 사용은 필수적인데요, 저는 부트스트랩 기반의 깔끔한 WYSIWYG editor로 많이 사용되고 있는 Summernote를 사용하고 있습니다. 오늘은에 이 Summernote에 커스텀 버튼을 만들고 해당 버튼에 깔끔한 반응형 모달인 JQuery 플러그인 iziModal을 붙이는 방법 에 대해 소개드리려고 합니다. Summernote와 iziModal를 설치하는 방법은 공식 홈페이지에서 확인 가능합니다. https://summernote.org/ https://izimodal.marcelodolza.com/ 저는 다음과 같이 Summernote에 .. 이전 1 2 3 4 다음
