# User signed up
Learn how to track when a user signs up.
This event tracks when a user creates an account.
> **When should you track this event?**
>
> Track this event whenever a user signs up. If your application logs users in immediately after signup, also track the [sign-in event](/reference/event/types/user-account/user-signed-in).
If the user profile does not exist, a new profile is created using provided information. This does not affect existing profiles.
## Implementation
Here is an example of how to track this event:
**JavaScript**
```javascript
import croct from '@croct/plug';
croct.track('userSignedUp', {
userId: '1ed2fd65-a027-4f3a-a35f-c6dd97537392',
profile: {
firstName: 'Carol',
lastName: 'Doe',
email: 'carol@croct.com',
custom: {
plan: 'pro'
}
}
});
```
**HTML**
```html
My awesome application
```
**React — JavaScript**
```jsx
import {useCroct} from '@croct/plug-react';
export function Example() {
const croct = useCroct();
const track = () => croct.track('userSignedUp', {
userId: '1ed2fd65-a027-4f3a-a35f-c6dd97537392',
profile: {
firstName: 'Carol',
lastName: 'Doe',
email: 'carol@croct.com',
custom: {
plan: 'pro'
}
}
});
return ();
}
```
**React — TypeScript**
```typescript
import {useCroct} from '@croct/plug-react';
import type {ReactElement} from 'react';
export function Example(): ReactElement {
const croct = useCroct();
const track = () => croct.track('userSignedUp', {
userId: '1ed2fd65-a027-4f3a-a35f-c6dd97537392',
profile: {
firstName: 'Carol',
lastName: 'Doe',
email: 'carol@croct.com',
custom: {
plan: 'pro'
}
}
});
return ();
}
```
**Next — JavaScript**
```jsx
import {useCroct} from '@croct/plug-next';
export function Example() {
const croct = useCroct();
const track = () => croct.track('userSignedUp', {
userId: '1ed2fd65-a027-4f3a-a35f-c6dd97537392',
profile: {
firstName: 'Carol',
lastName: 'Doe',
email: 'carol@croct.com',
custom: {
plan: 'pro'
}
}
});
return ();
}
```
**Next — TypeScript**
```tsx
import {useCroct} from '@croct/plug-next';
import type {ReactElement} from 'react';
export function Example(): ReactElement {
const croct = useCroct();
const track = () => croct.track('userSignedUp', {
userId: '1ed2fd65-a027-4f3a-a35f-c6dd97537392',
profile: {
firstName: 'Carol',
lastName: 'Doe',
email: 'carol@croct.com',
custom: {
plan: 'pro'
}
}
});
return ();
}
```
**Vue — JavaScript**
```vue
```
**Vue — TypeScript**
```vue
```
**Nuxt — JavaScript**
```vue
```
**Nuxt — TypeScript**
```vue
```
## Input properties
These are the supported properties:
- `userId`: `string`
The user's unique identifier provided by the application, such as a UUID or a username.
The value must be between 1 and 100 characters long.
- `profile`: `object` (optional)
The user profile.
See the [user reference](/reference/user/overview) for the full list of supported attributes.
## Processed properties
These properties are automatically tracked:
- `externalUserId`: `string`
This property corresponds to the [`userId`](#userid-prop) property provided in the input.
In the processed event, this property is referred to as `userId` to distinguish it from the unique identifier assigned internally to each user.
- `patch`: `object` (optional)
A series of operations derived from the [`profile`](#profile-prop) input property.
The patch created from the input profile is used internally to reflect changes in the user profile.
## Payload examples
Below are some payload examples for this event:
**Basic payload**
```json
{
"userId": "1ed2fd65-a027-4f3a-a35f-c6dd97537392"
}
```
**Full payload**
```json
{
"userId": "1ed2fd65-a027-4f3a-a35f-c6dd97537392",
"profile": {
"firstName": "Carol",
"lastName": "Doe",
"birthDate": "2000-08-31",
"gender": "female",
"email": "carol@croct.com",
"alternateEmail": "example@croct.com",
"phone": "+15555983800",
"alternatePhone": "+15555983800",
"address": {
"street": "123 Some Street",
"district": "Kings Oak",
"city": "San Francisco",
"state": "California",
"region": "California",
"country": "US",
"continent": "NA"
},
"avatar": "http: //croct.com/carol.png",
"company": "Croct",
"companyUrl": "http: //croct.com",
"jobTitle": "Head of Marketing",
"custom": {
"points": 1,
"favoriteEmoji": "🐊"
}
}
}
```
**Processed payload**
```json
{
"type": "userSignedUp",
"externalUserId": "1ed2fd65-a027-4f3a-a35f-c6dd97537392",
"patch": {
"operations": [
{
"type": "merge",
"path": ".",
"value": {
"firstName": "Carol",
"lastName": "Doe",
"birthDate": "2000-08-31",
"gender": "female",
"email": "carol@croct.com",
"alternateEmail": "example@croct.com",
"phone": "+15555983800",
"alternatePhone": "+15555983800",
"address": {
"street": "123 Some Street",
"district": "Kings Oak",
"city": "San Francisco",
"state": "California",
"region": "California",
"country": "US",
"continent": "NA"
},
"avatar": "http: //croct.com/carol.png",
"company": "Croct",
"companyUrl": "http: //croct.com",
"jobTitle": "Head of Marketing",
"custom": {
"points": 1,
"favoriteEmoji": "🐊"
}
}
}
]
}
}
```
## Explore
- [Analytics](/reference/analytics): Learn how to analyze your dashboards.
- [Event-based audiences](/reference/cql/expressions/events/event-types/signed-up): Learn how to create audiences based on this event.