글로벌 기업은 홈페이지에서 영어 번역을 어떻게 제공할까?

Slide 1

Slide 1 text

Ӗ۽ߥ ӝস਷ കಕ੉૑ীࢲ ৔য ߣ৉ਸ যڌѱ ઁҕೡө? Incheon / Songdo ীয೐ۨ޷ই ەझ / Android GDE ੉थ޹

Slide 2

Slide 2 text

(അ) ীয೐ۨ޷ই ەझ ೐ۿ౟ ݒפ੷ (അ) GDE Android Korea (੹) ߛ௼࢟۞٘ ೐ۿ౟ ݒפ੷ (੹) ٘ۄ݃ঙஹಌפ উ٘۽੉٘ ѐߊ੗ ੉थ޹

Slide 3

Slide 3 text

(അ) ীয೐ۨ޷ই ەझ ೐ۿ౟ ݒפ੷ (അ) GDE Android Korea (੹) ߛ௼࢟۞٘ ೐ۿ౟ ݒפ੷ (੹) ٘ۄ݃ঙஹಌפ উ٘۽੉٘ ѐߊ੗ ੉थ޹

Slide 4

Slide 4 text

ীয೐ۨ޷ইۆ?

Slide 5

Slide 5 text

೦ҕࢎח… Ӗ۽ߥ ࢲ࠺झ

Slide 6

Slide 6 text

ীয೐ۨ޷ইח… ب௡ ఑थё 35% LA ఑थё 45% SFO ఑थё 60% ৻Ҵੋ

Slide 7

Slide 7 text

ৈ۞ Ҵоীࢲ ࢎਊೞח Ӗ۽ߥ ࢲ࠺झח… ׮Ҵয ࢲ࠺झ ೙ࣻ ীয೐ۨ޷ইח ೠ/৔/ੌ ঱য ઁҕ ઺ 🇰🇷 🇺🇸 🇯🇵

Slide 8

Slide 8 text

Incheon / Songdo ীয೐ۨ޷ই੄ ׮Ҵয ࢲ࠺झ

Slide 9

Slide 9 text

Crowdinਵ۽ ׮Ҵয ҙܻೞӝ ݾର ӝઓ ׮Ҵয ҙܻ ߑߨҗ ѐࢶ ҅ദ Strapi۽ Crowdin ױ੼ ࠁ৮ೞӝ ݃ޖܻ

Slide 10

Slide 10 text

ӝઓ ׮Ҵয ҙܻ ߑߨҗ ѐࢶ ҅ദ

Slide 11

Slide 11 text

ӝࠄ੸ੋ ׮Ҵয ҙܻ ߑߨ 1 key-value ഋधਵ۽ ޙҳ ੷੢ { "booking_departure": "оחզ", "booking_schedule": "ੌ੿ࢶఖ", "booking_select": "ੌ੿ਸ ࢶఖ೧ ઱ࣁਃ.", "booking_done": "৘ড৮ܐ”, }

Slide 12

Slide 12 text

ӝࠄ੸ੋ ׮Ҵয ҙܻ ߑߨ 2 э਷ key۽ ׮ܲ ঱য value ੷੢ { "booking_departure": "оחզ", "booking_schedule": "ੌ੿ࢶఖ", "booking_select": "ੌ੿ਸ ࢶఖ೧ ઱ࣁਃ.", "booking_done": "৘ড৮ܐ”, } { "booking_departure": “Departure Date", "booking_schedule": "Select fare", "booking_select": "Select the schedule.", "booking_done": "successfully booked", } 🇰🇷 🇺🇸

Slide 13

Slide 13 text

ӝࠄ੸ੋ ׮Ҵয ҙܻ ߑߨ 3 ঱য, key чਸ ֈѹ ਗೞח valueী ੽Ӕ { "booking_departure": "оחզ", "booking_schedule": "ੌ੿ࢶఖ", "booking_select": "ੌ੿ਸ ࢶఖ೧ ઱ࣁਃ.", "booking_done": "৘ড৮ܐ”, } { "booking_departure": “Departure Date", "booking_schedule": "Select fare", "booking_select": "Select the schedule.", "booking_done": "successfully booked", } ko, booking_departure en, booking_departure

Slide 14

Slide 14 text

ীয೐ۨ޷ই੄ ӝઓ ׮Ҵয ҙܻ ߑߨ key-value

Slide 15

Slide 15 text

ীয೐ۨ޷ই੄ ӝઓ ׮Ҵয ҙܻ ߑߨ ੗୓ য٘޹ key-value

Slide 16

Slide 16 text

JSPীࢲ fmt కӒ۽ ׮Ҵয key ੽Ӕ

Slide 17

Slide 17 text

ӝઓ ׮Ҵয ҙܻ ߑߨ੄ ޙઁ੼ 1. key-valueо ׮Ҵযܳ ࢎਊೞח ೐ۿ౟ী হ׮.   adminী оࢲ ࠊঠೞפ ௏٘ оةࢿ ೞۅ. 2. ডҙ э੉ ӟ ޙҳب ޙ੢ ױਤ۽ ١۾غয ੓য ഝਊ੉ য۵׮. 3. ޙҳ ߸҃ ൤झషܻо হ׮.

Slide 18

Slide 18 text

߄ԲҊ र਷ ݽण 1. key-valueо ׮Ҵযܳ ࢎਊೞח ೐ۿ౟ী হ׮. key-valueܳ ೐ۿ౟ীࢲ ߄۽ ࠅ ࣻ ੓ب۾ ׮Ҵয ࣗझ ׮਍۽٘ 2. ডҙ э੉ ӟ ޙҳب ޙ੢ ױਤ۽ ١۾غয ੓য ഝਊ੉ য۵׮. static ੢ޙ਷ md۽ ҙܻ 3. ޙҳ ߸҃ ൤झషܻо হ׮. ־о, ঱ઁ, যڌѱ ߸҃೮ח૑ ൤झషܻ ҙܻ

Slide 19

Slide 19 text

૒੽ ݅٘۰ݶ… key-value ࢲߡ ҙܻ ч ੽Ӕ api য٘޹ (json/md ݣ౭ನݘ, ӂೠҙܻ, ൤झషܻ)

Slide 20

Slide 20 text

key-value ࢲߡ ҙܻ ч ੽Ӕ api য٘޹ (json/md ݣ౭ನݘ, ӂೠҙܻ, ൤झషܻ) 🤯 ૒੽ ݅٘۰ݶ…

Slide 21

Slide 21 text

ীয೐ۨ޷ইח… 💸😎 ࣛܖ࣌ ॳ੗!

Slide 22

Slide 22 text

ࣛܖ࣌ Ѩష

Slide 23

Slide 23 text

ࣛܖ࣌ ࢶ੿

Slide 24

Slide 24 text

Crowdinਵ۽ ׮Ҵয ҙܻೞӝ

Slide 25

Slide 25 text

Crowdin ӝמ source ҙܻ ߣ৉ بҳ ӂೠ ҙܻ ੗زച بҳ (api, ೒۞Ӓੋ) ӝఋ ӝמ

Slide 26

Slide 26 text

sourceۆ? ߣ৉ೞӝ ੹ ਗޙ key-value ૒੽ ੘ࢿ ೙ਃ { "booking_departure": "оחզ", "booking_schedule": "ੌ੿ࢶఖ", "booking_select": "ੌ੿ਸ ࢶఖ೧ ઱ࣁਃ.", "booking_done": "৘ড৮ܐ”, }

Slide 27

Slide 27 text

source ҙܻ json, csv, xml, md ׮নೠ ನݘ ૑ਗ

Slide 28

Slide 28 text

source ҙܻ keyо হח mdח ޙ੢ ױਤ۽ ߣ৉ೡ ࣻ ੓ب۾ ੜۄષ

Slide 29

Slide 29 text

ߣ৉ بҳ (ী٣ఠ)

Slide 30

Slide 30 text

ߣ৉ بҳ (ী٣ఠ) key ࢶఖ

Slide 31

Slide 31 text

ߣ৉ بҳ (ী٣ఠ) key ࢶఖ ߣ৉

Slide 32

Slide 32 text

ߣ৉ بҳ (ী٣ఠ) key ࢶఖ ߣ৉ ൤झషܻ

Slide 33

Slide 33 text

ӂೠ ҙܻ owner admin developer translator proofreader (җӘ) (ޖઁೠ) Manager 1 Manager 2 Translator 1 Translator 2

Slide 34

Slide 34 text

੗زച بҳ API CLI ೒۞Ӓੋ

Slide 35

Slide 35 text

੗زച بҳ API CLI ೒۞Ӓੋ ݽٚ য٘޹ ੘স API۽ оמ

Slide 36

Slide 36 text

੗زച بҳ API CLI ೒۞Ӓੋ

Slide 37

Slide 37 text

੗زച بҳ API CLI ೒۞Ӓੋ ఋ بҳ৬ ా೤/ো҅

Slide 38

Slide 38 text

ӝఋ ӝמ AI ߣ৉ ઁউ झ௼ܽࢫ ૓೯ ҙܻ

Slide 39

Slide 39 text

ӝఋ ӝמ AI ߣ৉ ઁউ झ௼ܽࢫ ૓೯ ҙܻ

Slide 40

Slide 40 text

ӝఋ ӝמ AI ߣ৉ ઁউ झ௼ܽࢫ ૓೯ ҙܻ keyী झ௼ܽࢫ ١۾

Slide 41

Slide 41 text

ӝఋ ӝמ AI ߣ৉ ઁউ झ௼ܽࢫ ૓೯ ҙܻ

Slide 42

Slide 42 text

Crowdinਵ۽ ׮Ҵয ҙܻೞӝ POо ೠҴয Source স۽٘ (csv) ೐ۿ౟ীࢲ csv ׮਍۽٘, json ౵य ߣ৉ ׮Ҵয ࢎਊೞӝ

Slide 43

Slide 43 text

׮Ҵয ࣗझ ߉ӝ POо ೠҴয Source স۽٘ (csv) ೐ۿ౟ীࢲ csv ׮਍۽٘, json ౵य ߣ৉ ׮Ҵয ࢎਊೞӝ

Slide 44

Slide 44 text

׮Ҵয ࣗझ ߉ӝ echo ">> 🌐 Download from Crowdin” # Download source files echo ">> 🇰🇷 Download source files" crowdin download sources --verbose # Download translations echo ">> 🌐 Download translations" crowdin download --verbose # Execute the script node ./scripts/generate-crowdin.js async function convertCsvToJson() { const fileNameArr = [koFileName, enFileName, jaFileName]; console.info(">> 🔧 JSON ߸ജ द੘”); fileNameArr.forEach((fileName) => { Papa.parse(fs.readFileSync(`${fileName}.csv`, "utf8"), { complete: (results) => { const data = {}; results.data.forEach((row) => { const key = row[0].replace(/[\b]/g, ""); // Remove backspace const value = row[1] .replace(/[\b]/g, "") .replace(/\\n/g, "
"); // Convert Line Break data[key] = value; }); fs.writeFileSync(`${fileName}.json`, JSON.stringify(data)); }, }); }); console.info(">> 🚀 JSON ߸ജ ৮ܐ"); } CLI۽ ߉Ҋ json ߸ജ

Slide 45

Slide 45 text

೐ۿ౟ীࢲ ׮Ҵয ࢎਊೞӝ POо ೠҴয Source স۽٘ (csv) ೐ۿ౟ীࢲ csv ׮਍۽٘, json ౵य ߣ৉ ׮Ҵয ࢎਊೞӝ

Slide 46

Slide 46 text

ӝࠄ੸ੋ ׮Ҵয ҙܻ ߑߨ ঱য, key чਸ ֈѹ ਗೞח valueী ੽Ӕ { "booking_departure": "оחզ", "booking_schedule": "ੌ੿ࢶఖ", "booking_select": "ੌ੿ਸ ࢶఖ೧ ઱ࣁਃ.", "booking_done": "৘ড৮ܐ”, } { "booking_departure": “Departure Date", "booking_schedule": "Select fare", "booking_select": "Select the schedule.", "booking_done": "successfully booked", } ko, booking_departure en, booking_departure

Slide 47

Slide 47 text

׮Ҵয ࢎਊ੄ ೨ब ঱য, key чਸ ֈѹ ਗೞח valueী ੽Ӕ { "booking_departure": "оחզ", "booking_schedule": "ੌ੿ࢶఖ", "booking_select": "ੌ੿ਸ ࢶఖ೧ ઱ࣁਃ.", "booking_done": "৘ড৮ܐ”, } { "booking_departure": “Departure Date", "booking_schedule": "Select fare", "booking_select": "Select the schedule.", "booking_done": "successfully booked", } ko, booking_departure en, booking_departure

Slide 48

Slide 48 text

׮Ҵয ࢎਊ੄ ೨ब ঱য, key чਸ ֈѹ ਗೞח valueী ੽Ӕ

Slide 49

Slide 49 text

key ࢎਊ import webKo from "@/dictionaries/ko/web.json"; loadWeb = (lang: Locale) => { if (lang === "ko") { return webKo; } if (lang === "en") { return webEn; } }; import json

Slide 50

Slide 50 text

valueী ߸ࣻ ઱ੑ

{t(“username_hello”, { username: ( {user?.firstName} {user?.lastName} ), })}

“username_hello”: "উ֞ೞࣁਃ {{username}}ש”, {{ }} ডࣘযী ߸ࣻܳ ઱ੑೞח hook ઁ੘

Slide 51

Slide 51 text

঱য ౸ױ pathী ঱য௏٘ ನೣ airpremia.com/ko/somePath airpremia.com/en/somePath

Slide 52

Slide 52 text

pathী ঱য௏٘ ನೣ 📁 [lang] airpremia.com/ko/somePath airpremia.com/en/somePath export default function Layout({ children, params, }: { children: React.ReactNode; params: { lang: Locale }; }) ঱য ౸ױ

Slide 53

Slide 53 text

pathী ঱য௏٘ হਵݶ Middlewareীࢲ ౸ױೞҊ redirect airpremia.com/somePath ঱য ౸ױ

Slide 54

Slide 54 text

pathী ঱য௏٘ হਵݶ Middlewareীࢲ ౸ױೞҊ redirect airpremia.com/somePath if (!pathUtil.hasPathLocale(pathname)) { const localeFromEnv = getLocaleFromEnv(request); const url = new URL( `/${localeFromEnv}${pathname}?${searchParams}`, request.url ); return NextResponse.redirect(url); } function getLocaleFromEnv(request: NextRequest) { const locales: string[] = i18n.locales; const languages = new Negotiator().languages(locales); return match(languages, locales, i18n.default); } export const i18n = { default: "ko", locales: ["ko", "en", "ja"], } as const; ঱য ౸ױ

Slide 55

Slide 55 text

Crowdin ױ੼ mdী html ֍ਵݶ ઙઙ ߡӒ पदр ߸҃(over-the-air) ࠺ऱ׮ ޙҳ ߸҃ೞ۰ݶ ߓನ ೙ਃ key ࢤࢿ оמೠ ݒפ੷ ࣻ ੸਺

Slide 56

Slide 56 text

Crowdin ױ੼ mdী html ֍ਵݶ ઙઙ ߡӒ पदр ߸҃(over-the-air) ࠺ऱ׮ ޙҳ ߸҃ೞ۰ݶ ߓನ ೙ਃ key ࢤࢿ оמೠ ݒפ੷ ࣻ ੸਺ 🤔 ੗୓ઁ੘ হ੉ ױ੼ਸ ࠁ৮ೡ ࣻ হਸө?

Slide 57

Slide 57 text

ੋझ఺ Headless CMS

Slide 58

Slide 58 text

Strapi۽ Crowdin ױ੼ ࠁ৮ೞӝ

Slide 59

Slide 59 text

Strapiۆ? ੋझ఺ Headless CMS ৈ۞ CMS ࣛܖ࣌ ઺ ೞա

Slide 60

Slide 60 text

CMS? ੋझ఺ Headless CMS Content Management System ৈ۞ CMS ࣛܖ࣌ ઺ ೞա Content DB & য٘޹

Slide 61

Slide 61 text

Headless? ੋझ఺ Headless CMS ٣੗ੋ হח CMS ৈ۞ CMS ࣛܖ࣌ ઺ ೞա Data݅ ࢲࡂ

Slide 62

Slide 62 text

ੋझ఺? ੋझ఺ Headless CMS ਋ܻ ੋ೐ۄী ࢸ஖೧ࢲ ࢎਊ ৈ۞ CMS ࣛܖ࣌ ઺ ೞա CMS ࢎਊী ؀೧ ࠺ਊ X

Slide 63

Slide 63 text

Strapi۽ Crowdin ױ੼ ࠁ৮ೞӝ ׮Ҵয ޙҳܳ Strapi۽ ࢲࡂೞӝ

Slide 64

Slide 64 text

Strapi ੢੼ ߸҃ द ߓನ হ੉ पदр ߈৔ ਋ܻ ੋ೐ۄীࢲ ઁҕೞפ ࠺ਊ੉ श ݒפ੷ ࣻ ޖઁೠ ׮Ҵয ޙҳܳ Strapi۽ ࢲࡂೞӝ

Slide 65

Slide 65 text

Crowdin-Strapi۽ ׮Ҵয ҙܻೞӝ Crowdin ా೧ࢲ ׮Ҵয json, md ߉ӝ ೐ۿ౟ীࢲ strapiী api۽ ਃ୒೧ࢲ ׮Ҵয ߉Ҋ ࢎਊ strapiী ࠂࠢ

Slide 66

Slide 66 text

Crowdin ా೧ࢲ ׮Ҵয json, md ߉ӝ strapiী ࠂࠢ const response = await fetch(`${path}?${params.toString()}`, { headers: { "Content-Type": "application/json", Authorization: `Bearer ${TOKEN}`, }, } Strapi api ೐ۿ౟ীࢲ strapiী api۽ ਃ୒೧ࢲ ׮Ҵয ߉Ҋ ࢎਊ

Slide 67

Slide 67 text

Strapi ׮Ҵয ࢲࡂ੄ ױ੼ 1 Crowdinীࢲ ࠂࠢ੉ ӈଳ׮ Sourceо Crowdin, Strapi 2ѐৈࢲ ഒࢶ

Slide 68

Slide 68 text

Strapi ׮Ҵয ࢲࡂ੄ ױ੼ 1 Crowdinীࢲ ࠂࠢ੉ ӈଳ׮ Sourceо Crowdin, Strapi 2ѐৈࢲ ഒࢶ Crowdin-Strapi زӝച ೒۞Ӓੋ दب ৘੿

Slide 69

Slide 69 text

Strapi ׮Ҵয ࢲࡂ੄ ױ੼ 2 Strapi ࢲߡ ౟ې೗ ҙܻ ݽٚ ޙҳ ࢲࡂ द (ࢲ࠺झ ౟ې೗ * N)੄ ࠗೞ

Slide 70

Slide 70 text

Strapi ׮Ҵয ࢲࡂ੄ ױ੼ 2 ই૒਷ ੌࠗ݅ ࢲࡂ Strapi ࢲߡ ౟ې೗ ҙܻ ݽٚ ޙҳ ࢲࡂ द (ࢲ࠺झ ౟ې೗ * N)੄ ࠗೞ

Slide 71

Slide 71 text

݃ޖܻ

Slide 72

Slide 72 text

ীয೐ۨ޷ই੄ ӝઓ ׮Ҵয ҙܻ ߑߨ ੗୓ য٘޹ key-value

Slide 73

Slide 73 text

Slide 74

Slide 74 text

ࣛܖ࣌ ࢶ੿

Slide 75

Slide 75 text

ীয೐ۨ޷ই੄ ׮Ҵয ҙܻ ߑߨ ੿ܻ POо ೠҴয Source স۽٘ (csv) ೐ۿ౟ীࢲ csv ׮਍۽٘, json ౵य ߣ৉ ׮Ҵয ࢎਊೞӝ

Slide 76

Slide 76 text

Crowdin ױ੼ mdী html ֍ਵݶ ઙઙ ߡӒ पदр ߸҃(over-the-air) ࠺ऱ׮ ޙҳ ߸҃ೞ۰ݶ ߓನ ೙ਃ key ࢤࢿ оמೠ ݒפ੷ ࣻ ੸਺

Slide 77

Slide 77 text

ੋझ఺ Headless CMS

Slide 78

Slide 78 text

Crowdin-Strapi۽ ׮Ҵয ҙܻೞӝ Crowdin ా೧ࢲ ׮Ҵয json, md ߉ӝ ೐ۿ౟ীࢲ strapiী api۽ ਃ୒೧ࢲ ׮Ҵয ߉Ҋ ࢎਊ strapiী ࠂࠢ

Slide 79

Slide 79 text

Strapi ׮Ҵয ࢲࡂ੄ ױ੼ Crowdinীࢲ ࠂࠢ੉ ӈଳ׮ Sourceо Crowdin, Strapi 2ѐৈࢲ ഒࢶ Strapi ࢲߡ ౟ې೗ ҙܻ ݽٚ ޙҳ ࢲࡂ द (ࢲ࠺झ ౟ې೗ * N)੄ ࠗೞ

Slide 80

Slide 80 text

૑Әө૑… Ӗ۽ߥ ࢲ࠺झੋ ীয೐ۨ޷ইо ׮Ҵযܳ ઁҕೞӝਤ೧ ೮؍ Ҋ޹ਸ ҕਬ 🧐

Slide 81

Slide 81 text

࠺तೞѱ ׮Ҵয ҙܻܳ Ҋ޹ೞदח ٜ࠙੉ ޖ঺ਸ Ҋ۰೧ঠ ೡ૑ ఃਕ٘ܳ ঳যо࣑ਵݶ ੉ ߊ಴ীࢲ… 🥰

Slide 82

Slide 82 text

Incheon / Songdo (ѐߊ੗ ழܻয, ӝࣿ, ৈ೯) ੷੄ ׮ܲ ࣁ࣌ب ݅աࠁࣁਃ