# create contact

**URL:** <https://community.hubspot.com/t/create-contact/87869>\
**Category:** APIs & Integrations\
**Tags:** email\
**Created:** [August 19, 2023, 9:40pm UTC](https://community.hubspot.com/t/create-contact/87869 "2023-08-19T21:40:16Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![BJunior](https://avatars.discourse-cdn.com/v4/letter/b/d07c76/32.png) [@BJunior](https://community.hubspot.com/u/BJunior)\
**Post date:** [August 19, 2023, 9:40pm UTC](https://community.hubspot.com/t/create-contact/87869/1 "2023-08-19T21:40:16Z")

</div>

Hi i have been trying to intergrate hubspot to get email signups but i keep getting the error below. My node js is up to date.

My code is right here

“use client”

import React, { useState } from ‘react’;

import ‘./SignUp.css’

const hubspot = require(‘@hubspot/api-client’)

function SignUp() {

const [email, setEmail] = useState(‘’);

const handleEmailChange = (event) =\> {

setEmail(event.target.value);

};

const handleSubmit = async (event) =\> {

event.preventDefault();

const hubspotClient = new hubspot.Client({ accessToken: process.env.HUBSPOT\_ACCESS\_TOKEN });

// Create the contact with email

const contactProperties = {

email: email,

};

const contactData = {

properties: contactProperties,

};

try {

const apiResponse = await hubspotClient.crm.contacts.basicApi.create(contactData);

console.log(JSON.stringify(apiResponse, null, 2));

// Handle success

} catch (error) {

if (error.message === ‘HTTP request failed’) {

console.error(JSON.stringify(error.response, null, 2));

} else {

console.error(error);

}

// Handle error

}

};

return (

\<section\>

\<div className=‘sign-up’\>

\<h2\>Sign Up for Our Newsletter\</h2\>

\<form onSubmit={handleSubmit}\>

\<input

type=“email”

id=“email”

name=“email”

value={email}

onChange={handleEmailChange}

required

/\>

\<button type=“submit”\>Subscribe\</button\>

\</form\>

\</div\>

\</section\>

)

}

export default SignUp

app-index.js:31 TypeError: url\_1.URL is not a constructor  
at new RequestContext (webpack-internal:///(:3000/app-pages-browser)/./node\_modules/@hubspot/api-client/lib/codegen/crm/contacts/http/http.js:54:20)  
at ServerConfiguration.makeRequestContext (webpack-internal:///(:3000/app-pages-browser)/./node\_modules/@hubspot/api-client/lib/codegen/crm/contacts/servers.js:25:16)  
at BasicApiRequestFactory.eval (webpack-internal:///(:3000/app-pages-browser)/./node\_modules/@hubspot/api-client/lib/codegen/crm/contacts/apis/BasicApi.js:50:55)  
at Generator.next (\<anonymous\>)  
at eval (webpack-internal:///(:3000/app-pages-browser)/./node\_modules/@hubspot/api-client/lib/codegen/crm/contacts/apis/BasicApi.js:8:71)  
at new Promise (\<anonymous\>)  
at \_\_awaiter (webpack-internal:///(:3000/app-pages-browser)/./node\_modules/@hubspot/api-client/lib/codegen/crm/contacts/apis/BasicApi.js:4:12)  
at BasicApiRequestFactory.create (webpack-internal:///(:3000/app-pages-browser)/./node\_modules/@hubspot/api-client/lib/codegen/crm/contacts/apis/BasicApi.js:44:16)  
at ObservableBasicApi.create (webpack-internal:///(:3000/app-pages-browser)/./node\_modules/@hubspot/api-client/lib/codegen/crm/contacts/types/ObservableAPI.js:29:59)  
at PromiseBasicApi.create (webpack-internal:///(:3000/app-pages-browser)/./node\_modules/@hubspot/api-client/lib/codegen/crm/contacts/types/PromiseAPI.js:14:33)  
at handleSubmit (webpack-internal:///(:3000/app-pages-browser)/./src/components/SignUp.js:31:75)  
at HTMLUnknownElement.callCallback (webpack-internal:///(:3000/app-pages-browser)/./node\_modules/next/dist/compiled/react-dom/cjs/react-dom.development.js:19443:14)  
at Object.invokeGuardedCallbackImpl (webpack-internal:///(:3000/app-pages-browser)/./node\_modules/next/dist/compiled/react-dom/cjs/react-dom.development.js:19492:16)  
at invokeGuardedCallback (webpack-internal:///(:3000/app-pages-browser)/./node\_modules/next/dist/compiled/react-dom/cjs/react-dom.development.js:19567:29)  
at invokeGuardedCallbackAndCatchFirstError (webpack-internal:///(:3000/app-pages-browser)/./node\_modules/next/dist/compiled/react-dom/cjs/react-dom.development.js:19581:25)  
at executeDispatch (webpack-internal:///(:3000/app-pages-browser)/./node\_modules/next/dist/compiled/react-dom/cjs/react-dom.development.js:30635:3)  
at processDispatchQueueItemsInOrder (webpack-internal:///(:3000/app-pages-browser)/./node\_modules/next/dist/compiled/react-dom/cjs/react-dom.development.js:30667:7)  
at processDispatchQueue (webpack-internal:///(:3000/app-pages-browser)/./node\_modules/next/dist/compiled/react-dom/cjs/react-dom.development.js:30680:5)  
at dispatchEventsForPlugins (webpack-internal:///(:3000/app-pages-browser)/./node\_modules/next/dist/compiled/react-dom/cjs/react-dom.development.js:30691:3)  
at eval (webpack-internal:///(:3000/app-pages-browser)/./node\_modules/next/dist/compiled/react-dom/cjs/react-dom.development.js:30881:12)  
at batchedUpdates$1 (webpack-internal:///(:3000/app-pages-browser)/./node\_modules/next/dist/compiled/react-dom/cjs/react-dom.development.js:23761:12)  
at batchedUpdates (webpack-internal:///(:3000/app-pages-browser)/./node\_modules/next/dist/compiled/react-dom/cjs/react-dom.development.js:27597:12)  
at dispatchEventForPluginEventSystem (webpack-internal:///(:3000/app-pages-browser)/./node\_modules/next/dist/compiled/react-dom/cjs/react-dom.development.js:30880:3)  
at dispatchEvent (webpack-internal:///(:3000/app-pages-browser)/./node\_modules/next/dist/compiled/react-dom/cjs/react-dom.development.js:28653:5)  
at dispatchDiscreteEvent (webpack-internal:///(:3000/app-pages-browser)/./node\_modules/next/dist/compiled/react-dom/cjs/react-dom.development.js:28624:5)

---

<div class="post-metadata">

**Author:** ![Jaycee\_Lewis](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/jaycee_lewis/32/61352_2.png) [@Jaycee\_Lewis](https://community.hubspot.com/u/Jaycee_Lewis)\
**Post date:** [August 22, 2023, 10:06pm UTC](https://community.hubspot.com/t/create-contact/87869/2 "2023-08-22T22:06:12Z")

</div>

Hi, @BJunior 👋 Welcome to our community! Were you able to make any progress with this? I’ve not found a good example of a set-up like this, and I am uncertain if we can use the SDK in the browser like you are attempting to do.

Have you tried moving this to a backend solution? And setting up a simple server-side endpoint to handle the request? This is like a more secure way to handle this request, as it prevents details from being accidentally revealed in the client’s browser.

Thanks for the additional information! — Jaycee

---

<div class="post-metadata">

**Author:** ![AyrtonAzcarsa](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/ayrtonazcarsa/32/201163_2.png) [@AyrtonAzcarsa](https://community.hubspot.com/u/AyrtonAzcarsa)\
**Post date:** [January 8, 2024, 7:18am UTC](https://community.hubspot.com/t/create-contact/87869/3 "2024-01-08T07:18:56Z")

</div>

¿Hola @BJunior lograste solucionar el error?

[@Jaycee\_Lewis](https://community.hubspot.com/t5/user/viewprofilepage/user-id/127074) Se pudo encontrar una solucion?  
Yo tambien tengo este problema como lo describo en: [https://community.hubspot.com/t5/APIs-Integrations/API-FORM-Contact-Next-Js/m-p/902065#M70127](https://community.hubspot.com/t5/APIs-Integrations/API-FORM-Contact-Next-Js/m-p/902065#M70127)

---

<div class="post-metadata">

**Author:** ![StavLevi](https://avatars.discourse-cdn.com/v4/letter/s/919ad9/32.png) [@StavLevi](https://community.hubspot.com/u/StavLevi)\
**Post date:** [February 6, 2024, 1:30pm UTC](https://community.hubspot.com/t/create-contact/87869/4 "2024-02-06T13:30:57Z")

</div>

i also have this error. [@Jaycee\_Lewis](https://community.hubspot.com/t5/user/viewprofilepage/user-id/127074) how can i resolve it ?
