안녕하세요. 
닷넷데브 프로필을 md 또는 html을 통해 공유 할 수 있도록 뱃지를 제작해봤습니다!
현재 개발된 뱃지는 small과 medium이 있고 디자인은 혼자 구상해 봤는데 쉽지가 않더라구요.
- (만약 좋은 디자인 아이디어 있으면 공유 부탁드립니다.
)
디자인은 다음과 같습니다.
현재 확인된 문제는 medium 뱃지 사용 시 사용자 이름이 긴 경우 잘리는 현상이 있어 개선 예정입니다.
서비스는 .NET6 web api 프로젝트로 minimal api를 사용하여 진행했습니다.
GET 요청을 통해 응답을 받아오기 때문에 닷넷데브 사이트에 트래픽을 줄이기 위해 cache-control:max-age=86400 (1day)로 설정 해놓았습니다.
뱃지를 통해 닷넷데브를 알리고 많은 닷넷 개발자들이 찾아왔으면 하는 바램이 있습니다. 
저번 포스트를 통해 확인은 했지만 혹시 문제소지가 있다면 서비스는 내리도록 하겠습니다.
감사합니다!
18 Likes
파란매
3
4 Likes
프로필이 비공개인 경우 정보를 가져올 수 없어 그렇습니다!
3 Likes
파란매
5
아 프로필이 비공개인것 처음 알았네요 이것 어디서 바꾸지 ^^;;; 설정 아무리 뒤져봐도 안나오네요 운영자들한테 문의해야 하나
3 Likes
https://profile.dotnetdev-badge.kr/api/v1/badge/medium?id=stupid&theme=Light
api 호출 시 svg 태그로 응답하게 되는데 md 또는 html에서 다음과 같이 사용해볼 수 있습니다.
// md
// html
<img src="https://profile.dotnetdev-badge.kr/api/v1/badge/medium?id=stupid&theme=Light" />
댓글에서도 md 형식을 사용할 수 있어 아래처럼 바로 사용가능합니다!
6 Likes
스몰뱃지는 하트 수를 표시하기보다는, 닷넷 데브 프로필로 가는 링크로 나타내고, 닉네임을 표시하는건 어떨까요?
4 Likes
파란매
10
svg 이미지라 링크를 걸거나 무슨 따로 기능을 거는것은 아마 안될것예요
4 Likes
의견 감사합니다!
링크 부분은 svg 응답 시 a 태그를 포함하여 테스트를 진행해 보았는데요.
html에서는 object 태그를 이용하면 링크로 이동이 가능하나 md에서는 img 태그 또는 ![]()를 통해서는 안되고 object 태그도 사용할 수 없는 것 같더라구요.
사용하는데 일관성이 없어 링크를 적용하는 부분은 사용자가 직접 적용해야 될 것 같아 보입니다.
// md
[](https://forum.dotnetdev.kr/u/chanos-dev/summary)
// html
<a href="https://forum.dotnetdev.kr/u/chanos-dev/summary">
<img src="https://profile.dotnetdev-badge.kr/api/v1/badge/small?id=chanos-dev&theme=Light"/>
</a>
5 Likes
rkttu
13
사용자 개별 설정에서 인터페이스 섹션에 그림과 같은 설정이 있는데, 이 설정을 변경하셔야하지 않을까 싶습니다.
![IMG_3796]()
6 Likes
감사합니다 잘 사용할게요
우선 깃허브에 적용완료에요!! ㅋㅋ
3 Likes
안녕하세요. 저번에 API로 뱃지 서비스를 제공했는데요!
백엔드만 올려놔서 뱃지를 확인하려면 직접 API를 호출해야 하는 번거로움이 있어, 간단하게 테스트할 수 있게 UI를 만들어 봤습니다. (아직 generate만 가능하고 미완성 입니다.)
https://chanos-dev.github.io/dotnetdev-badge/
생각만하고 있다가 드디어 실천하네요.
blazor wasm을 조금씩 공부만 하다가 실제 개발해 보는데 css가 쉽지 않더라고요.
올려놓고 모바일로 확인해 보니 반응형 UI 개선도 좀 필요한 상황이네요. 
호스팅은 github pages를 이용했고 설정은 How to Deploy Blazor WebAssembly to GitHub Pages 참고 했습니다.
감사하게도 몇몇 분들이 사용하고 계시더라고요. 감사합니다!
새해 복 많이 받으세요!
5 Likes
@chanos-dev 우와 기가 막히네요.
저도 제공해주신 사이트로 Generate 해봤습니다.
감사합니다. 
4 Likes
