Add map function to UI about 420market

[gitcoinbot]

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

---

This issue now has a funding of 0.1204 ETH (500.18 USD @ $4154.34/ETH) attached to it.

• If you would like to work on this issue you can 'start work' on the Gitcoin Issue Details page.
• Want to chip in? Add your own contribution here.
• Questions? Checkout Gitcoin Help or the Gitcoin's Discord
• $7,055,629.87 more funded OSS Work available on the Gitcoin Issue Explorer

[gitcoinbot]

Issue Status: 1. Open 2. Started 3. Submitted 4. Done

---

Work has been started.

These users each claimed they can complete the work by 264 years, 10 months from now.
Please review their action plans below:

1) joyjitpal100 has applied to start work (Funders only: approve worker | reject worker).

I would like to add a map to the ui. Any wireframes you have ?
2) djbowers has been approved to start work.

First, I would have to review your current code base and ask any questions that I needed to understand the architecture. Then, I would reviews the Google Maps API docs to understand how they integrate with React. Next, I would get the simplest version of the Google maps api working on your application. Then we could add in the functionality for storing user pins and so forth in our mongodb database. I think overall the project would take a couple weeks max.
3) necodev has been approved to start work.

Hi,

I can do what you want in a short time with the latest and up-to-date tech stacks.
4) bhautikbharadava has been approved to start work.

Hey there, I have good experience working with react and integrating libraries. I can integrate map on your website and accomplish given tasks
5) ayush20 has been approved to start work.

I have implemented a similar functionality recently and would like to discuss to understand the exact requirements and I am confident that this requirement can be achieved within this week.
6) rcstanciu has been approved to start work.

Ez: google maps/mapbox as the provider, job done in a couple of days
7) aweigor has been approved to start work.

Hello. Can do custom map, if needed.
8) eduardo-puentes has been approved to start work.

Set up the enviroment and add map function to UI
9) jay3183 has been approved to start work.

I will use React, with the map() function for rendering a list of data to the DOM.
10) xcanchal has been approved to start work.

I have solid experience working with Javascript/Typescript, React, and MongoDB, and I have some web3 skills as well so I can be a good fit. Let's discuss the details of the project and start working on it!
11) 0xlemontree has been approved to start work.

I am experienced in both mongodb and several javascript frameworks
12) vikranthkeerthipati has been approved to start work.

I intend on using an API to display the map and in order to add points to map, either utilize an existing framework or develop a custom framework to interact with the map. I can finish this up within a week.
13) hazard4233 has been approved to start work.

Hi, I hope you are doing well
I have 5 years experiences with MERN and google cloud service and will provide good result in 2 or 3 days
Please contact with me and let's talk about it in more details
thanks
Josiah
14) 1oyuncu has been approved to start work.

Merhaba, en son ve güncel teknoloji yığınları ile kısa sürede istediğinizi yapabilirim. Harita basit olacak sanırım
15) joaolobo94 has been approved to start work.

I will do this job. Talk to me if you want to have more information
16) miguel-202 has been approved to start work.

To begin with Google Maps JavaScript API you begin by importing MarkerClusterer from "@googlemaps/markerclusterer". Then you can begin by creating an element by ID "Map" which will cast to google API and bring a map (In the same declaration you enter different parameters for example zoom and where will the map be located: zoom: 3, center: { lat: -28.024, lng: 140.887 }) . STEP ONE COMPLETED
Now to enable users to add map points you need to create a marker matrix of dictionaries ({lat: 1, ing: 1 }, {lat:2, ing:2}, etc) and let the users access matrix with a function document.onclick= function(event) where the event triggers a new MarkerClusterer({ markers, map }); taking into account the coursors position (on the map, not on the screen). And to save users information into their stores, the waypoints should be saved inside a file that will be opened once the user connects to their stores.
17) gentcali has been approved to start work.

ok we may work together for a better solution
18) anhtuan21204 has been approved to start work.

Hello, I have experience with Mongodb and display mark on google map too
19) kosta1994r has been approved to start work.

Nach dem Ende des zweiten Weltkrieges war er als Mitglied der Stadt und der Universität Wien
20) ayushkumar63123 has been approved to start work.

I will add google map api to the ui as demanded in the bounty. I have used various apis and have an efficient knowledge about api calling in various programming languages. I also have experience in web development using html, css and javascript.
21) amreshk005 has been approved to start work.

I will Add map function to UI and will connect it to mongodb and UI , so Map will point connects to users store.
22) kimenyikevin has been approved to start work.

I will help you to implement map functionality in your project. I am an experienced, javascript developer.
23) alifakoor has been approved to start work.

I can implement these features in a short time, with Expressjs, Mongodb.
24) satyakam7 has been approved to start work.

I have worked with leaflet.js and ReactJs on a crowdsourcing application with heatmaps and all, so I know perfectly about all the UI elements.
25) jadelaawar has been approved to start work.

I am a professional developer and have already created a plan on how I will get this done and satisfy your needs.
26) wenheli has been approved to start work.

Hi,

I am interested in this project and I am an experienced frontend developer.
Just wondering if you have more detailed information?
27) azullazullyah has been approved to start work.

Good project is the best the reall Plarpom succes
28) dragondscript has been approved to start work.

I am interested in this task. Please contact me via mail ([email protected]) or, preferably, telegram (@aitor_gt)
29) ismaelsadeeq has been approved to start work.

I have worked on similar project in the past, and can implement the feature using google map api (React.s library) in the frontend and node express.js with mysql database to in the backend.

Learn more on the Gitcoin Issue Details page.

[ayushkumar63123]

I have begun writing the code. The only thing I need is a valid Google Maps API key with billing enabled. You would need to make a google cloud account and provide me the api key and I can move forward after that.

[420tiesto]

can we do a google meets meeting?

…

On Mon, Nov 29, 2021 at 9:53 AM ayushkumar63123 ***@***.***> wrote: I have begun writing the code. The only thing I need is a valid Google Maps API key with billing enabled. You would need to make a google cloud account and provide me the api key and I can move forward after that. — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#1 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ATFTID5GAEET4EW7ULOLAL3UOO43DANCNFSM5ISGKG5Q> .

[anhtuan21204]

Hello, Thanks for offer me this work, could you make clear on detail please?

[qualitydev33]

Hi, Could you make clear in more details?

Uhm he's hired many people 😄 so I leave the job 😅

[420tiesto]

I have begun writing the code. The only thing I need is a valid Google Maps API key with billing enabled. You would need to make a google cloud account and provide me the api key and I can move forward after that.

Can we schedule a google meets meeting to discuss everything?

[NeoSPU]

Dear, PRNTS!

About GitCoin task " Add Map Function To UI “
https://gitcoin.co/issue/420tiesto/420market/1/100027164
#1

I've got to resolve this task and going send to you my pull request!

I send to your mail ( [email protected]) a video screensaver of my decision:

https://drive.google.com/file/d/1L8Tm5zJ5q4OZjETIYViD0WeJ7xCyCAZU/view?usp=sharing

My Gitcoin page:
https://gitcoin.co/neospu

Regards, Neo SPU!

[420tiesto]

Dear, PRNTS!

About GitCoin task " Add Map Function To UI “ https://gitcoin.co/issue/420tiesto/420market/1/100027164 #1

I've got to resolve this task and going send to you my pull request!

I send to your mail ( [email protected]) a video screensaver of my decision:

https://drive.google.com/file/d/1L8Tm5zJ5q4OZjETIYViD0WeJ7xCyCAZU/view?usp=sharing

My Gitcoin page: https://gitcoin.co/neospu

Regards, Neo SPU!

sorry for the late response will check on it now! thanbk you!

[NeoSPU]

Hello! I wanna tell you some tuning moments of the .env file for the client -> this is about the next keys REACT_APP_NODE_ENV=development REACT_APP_GOOGLE_MAP_API_KEY= **** If you need REACT_APP_GOOGLE_MAP_API_KEY, I am ready to send my dev key to you.

…

On 11 Jan 2022, at 00:12, 420tiesto ***@***.***> wrote: Dear, PRNTS! About GitCoin task " Add Map Function To UI “ https://gitcoin.co/issue/420tiesto/420market/1/100027164 <https://gitcoin.co/issue/420tiesto/420market/1/100027164> #1 <#1> I've got to resolve this task and going send to you my pull request! I send to your mail ( ***@***.*** ***@***.***>) a video screensaver of my decision: https://drive.google.com/file/d/1L8Tm5zJ5q4OZjETIYViD0WeJ7xCyCAZU/view?usp=sharing <https://drive.google.com/file/d/1L8Tm5zJ5q4OZjETIYViD0WeJ7xCyCAZU/view?usp=sharing> My Gitcoin page: https://gitcoin.co/neospu <https://gitcoin.co/neospu> Regards, Neo SPU! sorry for the late response will check on it now! thanbk you! — Reply to this email directly, view it on GitHub <#1 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AHALSCG3Q2W6TIQ2RI3YQWTUVNKTTANCNFSM5ISGKG5Q>. Triage notifications on the go with GitHub Mobile for iOS <https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675> or Android <https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub>. You are receiving this because you commented.

[NeoSPU]

I've resolved this issue 25 days ago, but I haven't got check my pull request:

#2

Regards,
NeoSPU