๐Hackathon ๋ง๊ฐ์ผ์ ๋์ณค์ง๋ง, ๋ ํฐ ๋ฌธ์ ๋ฅผ ํด๊ฒฐํ์ด์: ์ฌ๋ฐ๋ฅธ Project Partner ์ฐพ๊ธฐ
Source: Dev.to
์์ด๋์ด๋ ์์ต๋๋ค.
์คํฌ๋ ์์ต๋๋ค.
๋๊ธฐ๋ถ์ฌ๋ ์์ต๋๋ค.
๊ทธ๋ฐ๋ฐ๋โฆ ์ฌ์ ํ ํผ์์ ๊ฐ๋ฐํ๊ณ ์์ฃ .
๊ทธ๋์ ์ ๋ Projura๋ฅผ ๋ง๋ค๊ธฐ๋ก ํ์ต๋๋ค โ ๊ฐ๋ฐ์, ๋์์ด๋, ๊ทธ๋ฆฌ๊ณ ์ ์์๋ค์ด ๋ฌด์์ ํ์์ด ์๋๋ผ ์ ํฉํ ํ๋ก์ ํธ ํํธ๋๋ฅผ ์ฐพ์ ์ ์๋๋ก ๋์์ฃผ๋ ์ฑ์ ๋๋ค. ์ด๋ฅผ ๋ง๋ค๋ฉด์ ์ค์ ํ์ ์ฑ์ด ์ด๋ป๊ฒ ์๋ํ๋์ง ๋ฐฐ์ ์ต๋๋ค.
Projura๋ ๋ฌด์์ธ๊ฐ์?
- โ ํ๋กํ ๋ง๋ค๊ธฐ
- โ ๊ธฐ์ ์ถ๊ฐ
- โ ํ๋ก์ ํธ ์์ด๋์ด ๊ฒ์
- โ ๊ธฐ์ ๊ธฐ๋ฐ์ผ๋ก ํ์ ์๋ฅผ ๋งค์นญ
- โ ํผ์์ ๋ง๋ค๊ธฐ๋ฅผ ๋ฉ์ถ์ธ์
๊ฐ์ง ๋คํธ์ํน์ ์์ต๋๋ค. ๋์๋ DM๋ ์์ต๋๋ค. ์ค์ง ๊ธฐ์ ๊ธฐ๋ฐ ํ์ ๋ง.
ํต์ฌ ์์ด๋์ด: ์ฝ๋ฉ์ฒ๋ผ ์ฌ๋ ๋งค์นญํ๊ธฐ
Projura๋ ์ฌ๋์ ๋ฌด์์๋ก ๋งค์นญํ์ง ์์ต๋๋ค. ๊ตฌ์กฐํ๋ ๋ฐ์ดํฐ๋ฅผ ์ฌ์ฉํฉ๋๋ค:
- ์ฌ์ฉ์ ๊ธฐ์
- ํ๋ก์ ํธ ์๊ตฌ์ฌํญ
์ํํธ์จ์ด๋ ๋ถ์๊ธฐ๋ฅผ ์ดํดํ์ง ๋ชปํ๊ณ โ ๋ ผ๋ฆฌ๋ฅผ ์ดํดํฉ๋๋ค.
Step 1: ์ฌ์ฉ์ ํ๋กํ ์์ฑ (๋ฐฑ์๋ ๋ก์ง)
ํ๋ก ํธ์๋ (JavaScript)
async function createUser() {
const res = await fetch("http://127.0.0.1:5000/users", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({
name: name.value,
bio: bio.value,
skills: skills.value
})
});
const data = await res.json();
userId = data.id;
}
๋ฐฑ์๋ (Flask API)
@app.route("/users", methods=["POST"])
def create_user():
data = request.json
user = User(
name=data["name"],
bio=data["bio"],
skills=data["skills"]
)
db.session.add(user)
db.session.commit()
return jsonify({"id": user.id})
์ด๊ณณ์ด Projura๊ฐ ๊ณต์์ ์ผ๋ก ๋น์ ์ ์กด์ฌ๋ฅผ ์ธ์ํ๋ ์๊ฐ์ ๋๋ค.
Step 2: ์ฌ์ฉ์ ๋ชจ๋ธ (๋ฐ์ดํฐ๊ฐ ์ ์ฅ๋๋ ๊ณณ)
class User(db.Model):
id = db.Column(db.Integer, primary_key=True)
name = db.Column(db.String(100))
bio = db.Column(db.Text)
skills = db.Column(db.Text)
์คํฌ์ ์ผํโ๊ตฌ๋ถ ๊ฐ์ผ๋ก ์ ์ฅ๋ฉ๋๋ค, ์์:
"python, flask, frontend"
์ ์ฅํ๊ธฐ ์ฝ๊ณ ๋น๊ตํ๊ธฐ๋ ์ฝ์ต๋๋ค.
Step 3: ํ๋ก์ ํธ๋ ์๊ตฌ ์ฌํญ์ด ํ์ํฉ๋๋ค
class Project(db.Model):
id = db.Column(db.Integer, primary_key=True)
title = db.Column(db.String(150))
description = db.Column(db.Text)
required_skills = db.Column(db.Text)
์ด์ ํ๋ก์ ํธ๋ ์ฌ์ฉ์์ ๋์ผํ ์ธ์ด์ธ ์คํฌ์ ์ฌ์ฉํฉ๋๋ค.
Step 4: ๋งค์นญ ๋ก์ง (์ค๋งํธ ํํธ)
from difflib import SequenceMatcher
def skill_match(a, b):
return SequenceMatcher(None, a, b).ratio()
์ฐ๋ฆฌ๋ ์ฌ์ฉ์ ์คํฌ๊ณผ ํ๋ก์ ํธ ์คํฌ์ ๋น๊ตํฉ๋๋ค; ์ ์ฌ๋ ๋น์จ์ด ๋์์๋ก ๋ ์ข์ ๋งค์น๊ฐ ๋ฉ๋๋ค. ์ด๋ ํ์ ์ ๋ฐ์ดํฐ ๊ธฐ๋ฐ ์์ฌ๊ฒฐ์ ์ผ๋ก ์ ํํฉ๋๋ค.
5๋จ๊ณ: ํ๋ก ํธ์๋์ ๋ฐฑ์๋๊ฐ ์ผ์นํด์ผ ํจ
fetch(`${API}/projects/${userId}`)
.then(res => res.json())
.then(data => {
projects.innerHTML = data.map(p =>
`- ${p.title}
`
).join("");
});
API๋ ๊ณ์ฝ์ ๋๋ค. ์ด๋ฅผ ๊นจ๋ฉด ์๋ฌด๊ฒ๋ ์๋ํ์ง ์์ต๋๋ค.
๋จ๊ณ 6: ๋๋ฒ๊น = ์ค์ ํ์ต
Typical problems I hit:
- โ ๋ฒํผ์ ํด๋ฆญํด๋ ์๋ฌด ์ผ๋ ์ผ์ด๋์ง ์์
- โ API๋ฅผ ํธ์ถํ์ง๋ง 500 ์ค๋ฅ ๋ฐํ
- โ ๋ฐ์ดํฐ๋ฒ ์ด์ค ์คํค๋ง ๋ถ์ผ์น
- โ CORS๊ฐ ์์ฒญ์ ์ฐจ๋จ
Each error forced me to learn:
- ๋ฐ์ดํฐ๋ฒ ์ด์ค๋ ์๋์ผ๋ก ์ ๋ฐ์ดํธ๋์ง ์์
- ํ๋ก ํธ์๋์ ๋ฐฑ์๋๊ฐ ์ผ์นํด์ผ ํ๋ ์ด์
- ๋ก๊ทธ๊ฐ ์ค์ํ ์ด์
- โ๋์ํ๋คโ์ โ์๋ํ๋คโ๋ ๋ค๋ฆ
This is where theory becomes engineering.
์ Projura๊ฐ ์ค์ํ๊ฐ
- ์ด๋ณด์๋ค์ ํ์์ ์ฐพ๋ ๋ฐ ์ด๋ ค์์ ๊ฒช๋๋ค
- ์๋ จ๋ ์ฌ๋๋ค์ ์ข ์ข ํผ์ ์์ ํ๋ค
- ํ๋ฅญํ ์์ด๋์ด๊ฐ ์ผ์ฐ ์ฌ๋ผ์ง๋ค
Projura๋ ์ฌ๋๋ค์ด ์ค์ ๋ก ํจ๊ป ๋ง๋ค ์ ์๋ ๊ฒ์ ๊ธฐ๋ฐํด ์ฐ๊ฒฐํฉ๋๋ค.
๊ฐ๋ฅํ ํฅํ ์ ๊ทธ๋ ์ด๋
- ๐ฅ ์ค์๊ฐ ์ฑํ
- ๐ฅ GitHub ํตํฉ
- ๐ฅ ์ถ์ฒ ์ ์ ๋งค๊ธฐ๊ธฐ
- ๐ฅ ํ๋ก์ ํธ ์ผ์
- ๐ฅ ํ ๋์๋ณด๋
๊ฐ ๊ธฐ๋ฅ์ Projura๋ฅผ ํ๋ก๋์ ์ ๋ ๊ฐ๊น๊ฒ ๋ง๋ญ๋๋ค.
์ต์ข ์๊ฐ
Projura๋ ๋์๊ฒ ์ค์ํ ๊ฒ์ ๊ฐ๋ฅด์ณ ์ฃผ์์ต๋๋ค: ์ฑ์ ์ฝ๋์ ๊ดํ ๊ฒ์ด ์๋๋ผ ์ธ๊ฐ์ ๋ฌธ์ ๋ฅผ ๋ ผ๋ฆฌ๋ก ๋ฐ๊พธ๋ ๊ฒ์ ๋๋ค. ์ฌ๋๋ค์ ์๋ฏธ ์๊ฒ ์ฐ๊ฒฐํ ์ ์๋ ์์คํ ์ ์ค๊ณํ ์ ์๋ค๋ฉด, ๋จ์ํ ์ฝ๋ฉํ๋ ๊ฒ์ด ์๋๋ผ ์ํฅ์ ๋ง๋๋ ๊ฒ์ ๋๋ค.
# coders language
print("Happy building ๐๐ป ")