์ฑ„๋„ํ†ก ์•„์ด์ฝ˜

My Location - ionic3 ์™€ Google Map Api ๋ฅผ ํ™œ์šฉํ•œ ๋‚ด ์œ„์น˜ ์ •๋ณด ์ฐพ๊ธฐ

ionic์— ๋Œ€ํ•œ ๊ฐœ๋ฐœ ๊ฒฝํ—˜์ด ์žˆ๋Š” ๊ฐœ๋ฐœ์ž ๋ฟ๋งŒ์•„๋‹ˆ๋ผ ์ „์ฒด์ ์ธ ionic project์˜ ๊ตฌ์„ฑ ๋ฐ ๊ฐœ๋ฐœ ๋ฐฉ๋ฒ•๋“ฑ์— ๋Œ€ํ•œ ์ „๋ฐ˜์ ์ธ ์ •๋ณด๋ฅผ ์ œ๊ณตํ•˜๋ฏ€๋กœ ionic ๊ฐœ๋ฐœ ๊ฒฝํ—˜์ด ์—†๋Š” ์ดˆ๋ณด์ž๋“ค์—๊ฒŒ๋„ ๋งŽ์€ ๋„์›€์ด ๋˜๋Š” ionic3 ๊ฐ•์ขŒ์ž…๋‹ˆ๋‹ค.

(5.0) ์ˆ˜๊ฐ•ํ‰ 19๊ฐœ

์ˆ˜๊ฐ•์ƒ 881๋ช…

๋‚œ์ด๋„ ์ดˆ๊ธ‰

์ˆ˜๊ฐ•๊ธฐํ•œ ๋ฌด์ œํ•œ

Thumbnail
๋‚ ๊ฐœ ๋‹ฌ๋ฆฐ ๋™์ „

๊ฐ•์˜ ์ถ”์ฒœํ•˜๊ณ  ์„ฑ์žฅ๊ณผ ์ˆ˜์ต์„ ๋งŒ๋“ค์–ด ๋ณด์„ธ์š”!

๋‚ ๊ฐœ ๋‹ฌ๋ฆฐ ๋™์ „

๋งˆ์ผ€ํŒ… ํŒŒํŠธ๋„ˆ์Šค

๊ฐ•์˜ ์ถ”์ฒœํ•˜๊ณ  ์„ฑ์žฅ๊ณผ ์ˆ˜์ต์„ ๋งŒ๋“ค์–ด ๋ณด์„ธ์š”!

๋จผ์ € ๊ฒฝํ—˜ํ•œ ์ˆ˜๊ฐ•์ƒ๋“ค์˜ ํ›„๊ธฐ

๋จผ์ € ๊ฒฝํ—˜ํ•œ ์ˆ˜๊ฐ•์ƒ๋“ค์˜ ํ›„๊ธฐ

5.0

5.0

Jang Jaehoon

60% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

์ข‹์€ ๊ฐ•์˜ ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค!

5.0

KYUNG TAE BAE

60% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

์•„์ด์˜ค๋‹‰3์— ๋Œ€ํ•ด ๊ถ๊ธˆํ–ˆ๋Š”๋ฐ ๋งŽ์ด๋ฐฐ์› ์Šต๋‹ˆ๋‹ค! ์ข‹์€ ๊ฐ•์˜ ๊ฐ์‚ฌ๋“œ๋ฆฝ๋‹ˆ๋‹ค!

5.0

๋˜˜๋˜˜์ด์Šค๋จธํ”„

100% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

๊ฐ•์˜ ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค.

์ˆ˜๊ฐ• ํ›„ ์ด๋Ÿฐ๊ฑธ ์–ป์„ ์ˆ˜ ์žˆ์–ด์š”

  • Ionic 3 ํ”„๋กœ์ ํŠธ ํ™˜๊ฒฝ ์„ค์ •

  • Google Map API ์„ค์ • ๋ฐ ํ™œ์šฉ

  • ์ง€๋„์— ์ปค์Šคํ…€ ๋งˆ์ปค ํ‘œ์‹œ

1. ๊ฐ•์˜ ์†Œ๊ฐœ

ionic3 ์™€ google์—์„œ ์ œ๊ณตํ•˜๋Š” map api๋ฅผ ์‚ฌ์šฉํ•ฉ๋‹ˆ๋‹ค. app์„ ๊ตฌ์„ฑํ•˜๋Š” ๊ฐœ๋ณ„์ ์ธ ๋ถ€๋ถ„๋“ค(component,module,function)์— ๋Œ€ํ•œ ์„ค๋ช…๋ณด๋‹ค๋Š” app ๊ฐœ๋ฐœ์— ๊ด€ํ•œ ์ „๋ฐ˜์ ์ธ ๋‚ด์šฉ ์ฆ‰, ๊ฐ๊ฐ์˜ component๋“ค์ด ์–ด๋–ป๊ฒŒ ๊ตฌ์„ฑ์ด ๋˜๊ณ , ์–ด๋–ค์‹์œผ๋กœ ์›ํ•˜๋Š” ์ •๋ณด๋ฅผ ๋ถˆ๋Ÿฌ์˜ค๊ณ , ๋‚ด๋ณด๋‚ด๋Š”์ง€...  ๋“ฑ๋“ฑ, ์ •๋ณด์˜ ํ๋ฆ„์— ๋Œ€ํ•œ ๋‚ด์šฉ์„ ์„ค๋ช…ํ•˜๋Š” ๋ฐฉ์‹์œผ๋กœ ์ง„ํ–‰์ด ๋˜๋ฏ€๋กœ, ionic ๊ฐœ๋ฐœ ๊ฒฝํ—˜์ด ์žˆ๋Š” ์‚ฌ์šฉ์ž๋ฟ๋งŒ ์•„๋‹ˆ๋ผ ์ฒ˜์Œ ionic์„ ์ ‘ํ•˜๋Š” ์ดˆ๋ณด์ž์—๊ฒŒ๋„ ionic project์˜ ๊ตฌ์„ฑ์— ๋Œ€ํ•œ ๋‚ด์šฉ์„ ์ „๋ฐ˜์ ์œผ๋กœ ํŒŒ์•…ํ•˜๋Š”๋ฐ ๋„์›€์ด ๋˜๋ฆฌ๋ผ ์ƒ๊ฐํ•ฉ๋‹ˆ๋‹ค.

2. ๋„์›€์ด ๋˜๋Š” ๋ถ„๋“ค

์ด๋ฏธ ionic์— ๋Œ€ํ•œ ๊ฐœ๋ฐœ ๊ฒฝํ—˜์ด ์žˆ๋Š” ๊ฐœ๋ฐœ์ž๋ฟ๋งŒ์•„๋‹ˆ๋ผ ์ „์ฒด์ ์ธ ionic project์˜ ๊ตฌ์„ฑ ๋ฐ ๊ฐœ๋ฐœ ๋ฐฉ๋ฒ•๋“ฑ์— ๋Œ€ํ•œ ์ „๋ฐ˜์ ์ธ ์ •๋ณด๋ฅผ ์ œ๊ณตํ•˜๋ฏ€๋กœ ionic ๊ฐœ๋ฐœ ๊ฒฝํ—˜์ด ์—†๋Š” ์ดˆ๋ณด์ž๋“ค์—๊ฒŒ๋„ ๋งŽ์€ ๋„์›€์ด ๋ ๊ฒƒ์œผ๋กœ ์ƒ๊ฐ๋ฉ๋‹ˆ๋‹ค.

3. ํ™˜๊ฒฝ

main feature

ionic 3 / Google Map APi  / ionic native Geolocation plugin / AlertController

๊ฐœ๋ฐœํ™˜๊ฒฝ

cli packages: (/usr/local/lib/node_modules) - @ionic/cli-utils  : 1.19.0 - ionic (Ionic CLI) : 3.19.0 global packages: - cordova (Cordova CLI) : 7.1.0 local packages: - @ionic/app-scripts : 3.1.4 - Cordova Platforms  : android 6.3.0 - Ionic Framework    : ionic-angular 3.9.2

System

ios-deploy : 1.9.2 Node       : v8.6.0 npm        : 5.5.1 OS         : macOS High Sierra Xcode      : Xcode 9.2 Build version 9C40b

 4. ์ง€์‹๊ณต์œ ์ž ์†Œ๊ฐœ


๊น€ ์ฒ ํ˜„ 

SDS LGAd ์‹ฌ๋งˆ๋‹ˆ(๊ฒ€์ƒ‰์—”์ง„) Mnet Media(ํ˜„ CJ E&M) ์„ ๊ฑฐ์ณ ํ˜„์žฌ ํ”„๋ฆฌ๋žœ์„œ/์ปจ์„คํ„ดํŠธ๋กœ ํ™œ๋™์ค‘

์ด๋Ÿฐ ๋ถ„๋“ค๊ป˜
์ถ”์ฒœ๋“œ๋ ค์š”

ํ•™์Šต ๋Œ€์ƒ์€
๋ˆ„๊ตฌ์ผ๊นŒ์š”?

  • Ionic 3์— ๊ด€์‹ฌ ์žˆ๋Š” ๋ถ„

  • ์œ„์น˜ ๊ธฐ๋ฐ˜ ์„œ๋น„์Šค ๊ฐœ๋ฐœ์„ ์›ํ•˜๋Š” ๋ถ„

  • Google Map API๋ฅผ ํ™œ์šฉํ•˜๊ณ  ์‹ถ์€ ๋ถ„

์•ˆ๋…•ํ•˜์„ธ์š”
๊น€์ฒ ํ˜„์ž…๋‹ˆ๋‹ค.

2,073

๋ช…

์ˆ˜๊ฐ•์ƒ

46

๊ฐœ

์ˆ˜๊ฐ•ํ‰

25

๊ฐœ

๋‹ต๋ณ€

4.9

์ 

๊ฐ•์˜ ํ‰์ 

3

๊ฐœ

๊ฐ•์˜

์ปค๋ฆฌํ˜๋Ÿผ

์ „์ฒด

5๊ฐœ โˆ™ (26๋ถ„)

๊ฐ•์˜ ๊ฒŒ์‹œ์ผ: 
๋งˆ์ง€๋ง‰ ์—…๋ฐ์ดํŠธ์ผ: 

์ˆ˜๊ฐ•ํ‰

์ „์ฒด

19๊ฐœ

5.0

19๊ฐœ์˜ ์ˆ˜๊ฐ•ํ‰

  • KYUNG TAE BAE๋‹˜์˜ ํ”„๋กœํ•„ ์ด๋ฏธ์ง€
    KYUNG TAE BAE

    ์ˆ˜๊ฐ•ํ‰ 303

    โˆ™

    ํ‰๊ท  ํ‰์  5.0

    5

    60% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

    ์•„์ด์˜ค๋‹‰3์— ๋Œ€ํ•ด ๊ถ๊ธˆํ–ˆ๋Š”๋ฐ ๋งŽ์ด๋ฐฐ์› ์Šต๋‹ˆ๋‹ค! ์ข‹์€ ๊ฐ•์˜ ๊ฐ์‚ฌ๋“œ๋ฆฝ๋‹ˆ๋‹ค!

    • dmax๋‹˜์˜ ํ”„๋กœํ•„ ์ด๋ฏธ์ง€
      dmax

      ์ˆ˜๊ฐ•ํ‰ 146

      โˆ™

      ํ‰๊ท  ํ‰์  5.0

      5

      100% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

      • Jang Jaehoon๋‹˜์˜ ํ”„๋กœํ•„ ์ด๋ฏธ์ง€
        Jang Jaehoon

        ์ˆ˜๊ฐ•ํ‰ 677

        โˆ™

        ํ‰๊ท  ํ‰์  4.9

        5

        60% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

        ์ข‹์€ ๊ฐ•์˜ ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค!

        • ๋˜˜๋˜˜์ด์Šค๋จธํ”„๋‹˜์˜ ํ”„๋กœํ•„ ์ด๋ฏธ์ง€
          ๋˜˜๋˜˜์ด์Šค๋จธํ”„

          ์ˆ˜๊ฐ•ํ‰ 868

          โˆ™

          ํ‰๊ท  ํ‰์  5.0

          5

          100% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

          ๊ฐ•์˜ ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค.

          • ๋ฟก์ด๋‹˜์˜ ํ”„๋กœํ•„ ์ด๋ฏธ์ง€
            ๋ฟก์ด

            ์ˆ˜๊ฐ•ํ‰ 81

            โˆ™

            ํ‰๊ท  ํ‰์  4.9

            5

            20% ์ˆ˜๊ฐ• ํ›„ ์ž‘์„ฑ

            ์ข‹์€ ๊ฐ•์˜ ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค.

            ๊น€์ฒ ํ˜„๋‹˜์˜ ๋‹ค๋ฅธ ๊ฐ•์˜

            ์ง€์‹๊ณต์œ ์ž๋‹˜์˜ ๋‹ค๋ฅธ ๊ฐ•์˜๋ฅผ ๋งŒ๋‚˜๋ณด์„ธ์š”!

            ๋น„์Šทํ•œ ๊ฐ•์˜

            ๊ฐ™์€ ๋ถ„์•ผ์˜ ๋‹ค๋ฅธ ๊ฐ•์˜๋ฅผ ๋งŒ๋‚˜๋ณด์„ธ์š”!

            ๋ฌด๋ฃŒ