diff --git a/components/ExtendedButton/ExtendedButton.tsx b/components/ExtendedButton/ExtendedButton.tsx
new file mode 100644
index 0000000000..4e27c3f8f6
--- /dev/null
+++ b/components/ExtendedButton/ExtendedButton.tsx
@@ -0,0 +1,27 @@
+export default function ExtendedButton({ title, link }) {
+ const handleClick = () => {
+ window.location.href = link; // Redirects to the specified link
+ }
+
+ return (
+
+ )
+ }
+
\ No newline at end of file
diff --git a/components/Search/Search.module.scss b/components/Search/Search.module.scss
index 0d428c4c12..34a300ca7b 100644
--- a/components/Search/Search.module.scss
+++ b/components/Search/Search.module.scss
@@ -11,4 +11,14 @@
.inputContainer {
display: flex;
flex-direction: row;
+}
+
+@media (max-width: 768px) {
+ .searchBar {
+ display: none;
+ }
+
+ .icon {
+ width: 20px;
+ }
}
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index 4f01148209..94677327b1 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -17,18 +17,18 @@
"nextra-theme-docs": "*",
"react": "^18.2.0",
"react-dom": "^18.2.0",
- "sass": "^1.74.1",
+ "sass": "^1.77.0",
"sharp": "^0.32.6"
},
"devDependencies": {
"@redocly/openapi-cli": "1.0.0-beta.16",
"@types/mixpanel": "^2.14.8",
- "@types/node": "20.12.5",
+ "@types/node": "20.12.8",
"autoprefixer": "^10.4.19",
"postcss": "^8.4.38",
"rdme": "8.6.6",
"tailwindcss": "^3.4.3",
- "typescript": "^5.4.4",
+ "typescript": "^5.4.5",
"yaml": "2.4.1"
}
},
@@ -1489,9 +1489,9 @@
"integrity": "sha512-iiUgKzV9AuaEkZqkOLDIvlQiL6ltuZd9tGcW3gwpnX8JbuiuhFlEGmmFXEXkN50Cvq7Os88IY2v0dkDqXYWVgA=="
},
"node_modules/@types/node": {
- "version": "20.12.5",
- "resolved": "https://registry.npmjs.org/@types/node/-/node-20.12.5.tgz",
- "integrity": "sha512-BD+BjQ9LS/D8ST9p5uqBxghlN+S42iuNxjsUGjeZobe/ciXzk2qb1B6IXc6AnRLS+yFJRpN2IPEHMzwspfDJNw==",
+ "version": "20.12.8",
+ "resolved": "https://registry.npmjs.org/@types/node/-/node-20.12.8.tgz",
+ "integrity": "sha512-NU0rJLJnshZWdE/097cdCBbyW1h4hEg0xpovcoAQYHl8dnEyp/NAOiE45pvc+Bd1Dt+2r94v2eGFpQJ4R7g+2w==",
"dev": true,
"dependencies": {
"undici-types": "~5.26.4"
@@ -8524,9 +8524,9 @@
"integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
},
"node_modules/sass": {
- "version": "1.74.1",
- "resolved": "https://registry.npmjs.org/sass/-/sass-1.74.1.tgz",
- "integrity": "sha512-w0Z9p/rWZWelb88ISOLyvqTWGmtmu2QJICqDBGyNnfG4OUnPX9BBjjYIXUpXCMOOg5MQWNpqzt876la1fsTvUA==",
+ "version": "1.77.0",
+ "resolved": "https://registry.npmjs.org/sass/-/sass-1.77.0.tgz",
+ "integrity": "sha512-eGj4HNfXqBWtSnvItNkn7B6icqH14i3CiCGbzMKs3BAPTq62pp9NBYsBgyN4cA+qssqo9r26lW4JSvlaUUWbgw==",
"dependencies": {
"chokidar": ">=3.0.0 <4.0.0",
"immutable": "^4.0.0",
@@ -9527,9 +9527,9 @@
}
},
"node_modules/typescript": {
- "version": "5.4.4",
- "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.4.tgz",
- "integrity": "sha512-dGE2Vv8cpVvw28v8HCPqyb08EzbBURxDpuhJvTrusShUfGnhHBafDsLdS1EhhxyL6BJQE+2cT3dDPAv+MQ6oLw==",
+ "version": "5.4.5",
+ "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.5.tgz",
+ "integrity": "sha512-vcI4UpRgg81oIRUFwR0WSIHKt11nJ7SAVlYNIu+QpqeyXP+gpQJy/Z4+F0aGxSE4MqwjyXvW/TzgkLAx2AGHwQ==",
"dev": true,
"bin": {
"tsc": "bin/tsc",
@@ -11439,9 +11439,9 @@
"integrity": "sha512-iiUgKzV9AuaEkZqkOLDIvlQiL6ltuZd9tGcW3gwpnX8JbuiuhFlEGmmFXEXkN50Cvq7Os88IY2v0dkDqXYWVgA=="
},
"@types/node": {
- "version": "20.12.5",
- "resolved": "https://registry.npmjs.org/@types/node/-/node-20.12.5.tgz",
- "integrity": "sha512-BD+BjQ9LS/D8ST9p5uqBxghlN+S42iuNxjsUGjeZobe/ciXzk2qb1B6IXc6AnRLS+yFJRpN2IPEHMzwspfDJNw==",
+ "version": "20.12.8",
+ "resolved": "https://registry.npmjs.org/@types/node/-/node-20.12.8.tgz",
+ "integrity": "sha512-NU0rJLJnshZWdE/097cdCBbyW1h4hEg0xpovcoAQYHl8dnEyp/NAOiE45pvc+Bd1Dt+2r94v2eGFpQJ4R7g+2w==",
"dev": true,
"requires": {
"undici-types": "~5.26.4"
@@ -16510,9 +16510,9 @@
"integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
},
"sass": {
- "version": "1.74.1",
- "resolved": "https://registry.npmjs.org/sass/-/sass-1.74.1.tgz",
- "integrity": "sha512-w0Z9p/rWZWelb88ISOLyvqTWGmtmu2QJICqDBGyNnfG4OUnPX9BBjjYIXUpXCMOOg5MQWNpqzt876la1fsTvUA==",
+ "version": "1.77.0",
+ "resolved": "https://registry.npmjs.org/sass/-/sass-1.77.0.tgz",
+ "integrity": "sha512-eGj4HNfXqBWtSnvItNkn7B6icqH14i3CiCGbzMKs3BAPTq62pp9NBYsBgyN4cA+qssqo9r26lW4JSvlaUUWbgw==",
"requires": {
"chokidar": ">=3.0.0 <4.0.0",
"immutable": "^4.0.0",
@@ -17251,9 +17251,9 @@
}
},
"typescript": {
- "version": "5.4.4",
- "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.4.tgz",
- "integrity": "sha512-dGE2Vv8cpVvw28v8HCPqyb08EzbBURxDpuhJvTrusShUfGnhHBafDsLdS1EhhxyL6BJQE+2cT3dDPAv+MQ6oLw==",
+ "version": "5.4.5",
+ "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.5.tgz",
+ "integrity": "sha512-vcI4UpRgg81oIRUFwR0WSIHKt11nJ7SAVlYNIu+QpqeyXP+gpQJy/Z4+F0aGxSE4MqwjyXvW/TzgkLAx2AGHwQ==",
"dev": true
},
"typical": {
diff --git a/package.json b/package.json
index dbff2fa253..88c503d6e1 100644
--- a/package.json
+++ b/package.json
@@ -31,18 +31,18 @@
"nextra-theme-docs": "latest",
"react": "^18.2.0",
"react-dom": "^18.2.0",
- "sass": "^1.74.1",
+ "sass": "^1.77.0",
"sharp": "^0.32.6"
},
"devDependencies": {
"@redocly/openapi-cli": "1.0.0-beta.16",
"@types/mixpanel": "^2.14.8",
- "@types/node": "20.12.5",
+ "@types/node": "20.12.8",
"autoprefixer": "^10.4.19",
"postcss": "^8.4.38",
"rdme": "8.6.6",
"tailwindcss": "^3.4.3",
- "typescript": "^5.4.4",
+ "typescript": "^5.4.5",
"yaml": "2.4.1"
}
}
diff --git a/pages/_document.js b/pages/_document.js
index dc7f0db457..8e537e4c47 100644
--- a/pages/_document.js
+++ b/pages/_document.js
@@ -42,6 +42,7 @@ export default function Document() {
data-modal-example-questions='What is the first event I should track?,How do I migrate off Google Analytics?,How do I calculate time spent?,How do I import Snowflake data?'
data-modal-override-open-class-search="top-nav-search-bar"
data-search-include-source-names='["Documentation","Query API Reference"]'
+ data-modal-command-k-search-mode-default="true"
>
+ ```
+
+
+ ```text
+ npm install --save mixpanel-browser
+ ```
+
+
+ ```text
+ yarn add mixpanel-browser
+ ```
+
+
+##### Configure the SDK
+Replace `YOUR_TOKEN` with your project token. You can find your token [here](https://mixpanel.com/settings/project).
+
+```js Javascript
+//Import Mixpanel SDK
+import mixpanel from 'mixpanel-browser';
+
+// Near entry of your product, init Mixpanel
+mixpanel.init('YOUR_TOKEN', {debug: true, track_pageview: true, persistence: 'localStorage'});
+```
+
+
+
+
+##### Install the SDK
+```shell Python
+pip install mixpanel
+```
+##### Configure the SDK
+Replace `YOUR_TOKEN` with your project token. You can find your token [here](https://mixpanel.com/settings/project).
+```python Python
+from mixpanel import Mixpanel
+
+mp = Mixpanel("YOUR_TOKEN")
+```
+
+
+
+##### Install the SDK
+```shell Node.js
+npm install mixpanel
+```
+##### Configure the SDK
+Replace `YOUR_TOKEN` with your project token. You can find your token [here](https://mixpanel.com/settings/project).
+```js Node.js
+// Grab the Mixpanel factory
+var Mixpanel = require('mixpanel');
+
+// Create an instance of the mixpanel client
+var mixpanel = Mixpanel.init('YOUR_TOKEN');
+```
+
+
+
+##### Install the SDK
+```shell Go
+go get github.com/mixpanel/mixpanel-go
+```
+##### Configure the SDK
+Replace `YOUR_TOKEN` with your project token. You can find your token [here](https://mixpanel.com/settings/project).
+```shell Go
+package main
+
+import (
+ "context"
+ "github.com/mixpanel/mixpanel-go"
+)
+
+func main() {
+ ctx := context.Background()
+ mp := mixpanel.NewApiClient("YOUR_TOKEN")
+}
+```
+
+
+
+##### Install the SDK
+```shell Ruby
+gem install mixpanel-ruby
+```
+##### Configure the SDK
+Replace `YOUR_TOKEN` with your project token. You can find your token [here](https://mixpanel.com/settings/project).
+```ruby Ruby
+require 'mixpanel-ruby'
+
+mp = Mixpanel::Tracker.new(YOUR_TOKEN)
+```
+
+
+
+##### Install the SDK
+```xml Java
+
+
+ com.mixpanel
+ mixpanel-java
+ 1.4.4
+
+```
+##### Configure the SDK
+Replace `YOUR_TOKEN` with your project token. You can find your token [here](https://mixpanel.com/settings/project).
+```java Java
+//Import Mixpanel API
+import com.mixpanel.mixpanelapi.MessageBuilder;
+import com.mixpanel.mixpanelapi.MixpanelAPI;
+
+// Set up an instance of MixpanelAPI
+MixpanelAPI mixpanel = new MixpanelAPI();
+
+MessageBuilder messageBuilder = new MessageBuilder('YOUR_TOKEN');
+```
+
+
+
+##### Install the SDK
+Under your app's root directory, run:
+
+```
+npm install mixpanel-react-native
+```
+
+Under your application's iOS folder, run:
+
+```
+pod install
+```
+
+Note: For XCode 12.5+, there is a known compile issue, please refer to this [workaround](https://github.com/mixpanel/mixpanel-react-native/issues/43#issuecomment-829599732).
+##### Configure the SDK
+Replace `YOUR_TOKEN` with your project token. You can find your token [here](https://mixpanel.com/settings/project).
+```javascript
+//Import Mixpanel API
+import { Mixpanel } from "mixpanel-react-native";
+
+// Set up an instance of Mixpanel
+const trackAutomaticEvents = false;
+const mixpanel = new Mixpanel("YOUR_TOKEN", trackAutomaticEvents);
+mixpanel.init();
+```
+
+
+
+##### Install the SDK
+Add `mixpanel_flutter: ^2.0.0` to your package's pubspec.yaml file and run:
+
+```
+flutter pub get
+```
+##### Configure the SDK
+Replace `YOUR_TOKEN` with your project token. You can find your token [here](https://mixpanel.com/settings/project).
+```dart
+import 'package:mixpanel_flutter/mixpanel_flutter.dart';
+class _YourClassState extends State {
+ Mixpanel mixpanel;
+
+ @override
+ void initState() {
+ super.initState();
+ initMixpanel();
+ }
+
+ Future initMixpanel() async {
+ // Once you've called this method once, you can access `mixpanel` throughout the rest of your application.
+ mixpanel = await Mixpanel.init("YOUR_TOKEN", trackAutomaticEvents: false);
+ }
+}
+```
+
+
+
+##### Install the SDK
+
+
+
+Note: Swift Package Manager requires Xcode 12+
+1. In Xcode, select File > Swift Packages > Add Package Dependency.
+2. Follow the prompts using the URL for this repository and must select a version greater than or equal to v4.0.0
+
+
+
+1. Create a Podfile in your Xcode project directory by running `pod init` in your terminal, edit the Podfile generated, and add the following line: `pod 'Mixpanel'`.
+2. Run `pod install` in your Xcode project directory. CocoaPods should download and install the Mixpanel library, and create a new Xcode workspace. Open up this workspace in Xcode or typing `open *.xcworkspace` in your terminal.
+
+
+
+Add `github "mixpanel/mixpanel-iphone"` to your Cartfile.
+
+
+
+##### Configure the SDK
+Replace `YOUR_TOKEN` with your project token. You can find your token [here](https://mixpanel.com/settings/project).
+```objc
+#import "Mixpanel/Mixpanel.h"
+
+- (BOOL)application:(UIApplication _)application
+ didFinishLaunchingWithOptions:(NSDictionary _)launchOptions {
+ ...
+ Mixpanel *mixpanel = [Mixpanel sharedInstanceWithToken:@"YOUR_TOKEN"
+ trackAutomaticEvents: NO];
+ ...
+}
+```
+
+
+
+##### Install the SDK
+
+
+
+Note: Swift Package Manager requires Xcode 12+
+1. In Xcode, select File > Swift Packages > Add Package Dependency.
+2. Paste the URL `https://github.com/mixpanel/mixpanel-swift` and a minimum semantic version of v2.8.0.
+
+
+
+1. Create a Podfile in your Xcode project directory by running `pod init` in your terminal, edit the Podfile generated, and add the following line: `pod 'Mixpanel-swift'`.
+2. Run `pod install` in your Xcode project directory. CocoaPods should download and install the Mixpanel library, and create a new Xcode workspace. Open up this workspace in Xcode or typing `open *.xcworkspace` in your terminal.
+
+
+
+Add `github "mixpanel/mixpanel-swift"` to your Cartfile.
+
+
+
+##### Configure the SDK
+1. Import Mixpanel into `AppDelegate.swift`
+2. Initialize Mixpanel within `application:didFinishLaunchingWithOptions` as seen below
+
+Replace `YOUR_TOKEN` with your project token. You can find your token [here](https://mixpanel.com/settings/project).
+
+```swift
+import Mixpanel
+
+func application(_ application: UIApplication,
+ didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) -> Bool {
+ ...
+ // Replace with your Project Token
+ Mixpanel.initialize(token: "YOUR_TOKEN", trackAutomaticEvents: false)
+ ...
+}
+```
+
+
+
+##### Install the SDK
+Add `implementation 'com.mixpanel.android:mixpanel-android:7.+'` as a dependency to your `build.gradle` file.
+
+Once you've updated `build.gradle`, you can force Android Studio to sync with your new configuration by clicking the Sync Project with Gradle Files icon at the top of the window:
+![Sync Android With Gradle](https://storage.googleapis.com/cdn-mxpnl-com/static/readme/android-sync-gradle.png)
+
+If it cannot find the dependency, you should make sure you've specified `mavenCentral()` as a repository in `build.gradle`.
+
+Next, add the following permissions in your AndroidManifest.xml:
+
+```java
+
+
+
+
+
+
+
+
+```
+##### Configure the SDK
+Replace `YOUR_TOKEN` with your project token. You can find your token [here](https://mixpanel.com/settings/project).
+```java
+import com.mixpanel.android.mpmetrics.MixpanelAPI;
+
+public class MainActivity extends ActionBarActivity {
+ private MixpanelAPI mp;
+
+ @Override
+ protected void onCreate(Bundle savedInstanceState) {
+ super.onCreate(savedInstanceState);
+ setContentView(R.layout.activity_main);
+
+ trackAutomaticEvents = false;
+ // Replace with your Project Token
+ mp = MixpanelAPI.getInstance(this, "YOUR_TOKEN", trackAutomaticEvents);
+ }
+}
+```
+
+
+
+##### Install the SDK
+Add `https://github.com/mixpanel/mixpanel-unity.git#master` to the dependencies section of `com.mixpanel.unity`.
+
+Alternatively, you can download and install the .unitypackage file from our [releases page](https://github.com/mixpanel/mixpanel-unity/releases).
+##### Configure the SDK
+To initialize the library, first open the unity project settings menu for Mixpanel. (Edit -> Project Settings -> Mixpanel)
+Then, enter your project token into the Token and Debug Token input fields within the inspector.
+You can find your token [here](https://mixpanel.com/settings/project).
+
+
+![unity_screenshots](https://user-images.githubusercontent.com/36679208/152408022-62440f50-04c7-4ff3-b331-02d3d3122c9e.jpg)
+
+Note: If you prefer to initialize Mixpanel manually, you can select the `Manual Initialization` in the settings and
+call `Mixpanel.Init()` to initialize.
+
+To use mixpanel, add the following sample code to a part of your application:
+
+```csharp
+using mixpanel;
+```
+You're
+
+
+##### Install the SDK
+
+
+ No install required
+
+Using the HTTP API does not require an installation. **You're ready to move to the next step.**
+
+
+
+
+
+
+
+{/* Next Section */}
+
+
+
+
+
+
Next: Identify Your Users
+
With Mixpanel installed, you’re now ready to identify the users who use your product.
+
+
+
+
+
+
+## FAQ
+
+export function FAQBox({ title, children }) {
+ return (
+
+
+ {title}
+
+
{children}
+
+ )
+}
+
+
+ Yes, if you pass `track_pageview: true` in the `mixpanel.init()` call,
+ Mixpanel will automatically track a "Page View" event every time a new
+ page is loaded.
+ Learn more [here](/docs/tracking-methods/sdks/javascript#tracking-page-views).
+
+
+
+ When tracking on web, we recommend using localStorage, as this is more reliable:
+
+```javascript
+mixpanel.set_config({ persistence: "localStorage" });
+```
+
+
+
+ No, our Mixpanel JavaScript SDK does not set or use any third-party cookies. If you wish
+ to disable cookies entirely, you can set the disable_persistence option to true when initializing
+ your Mixpanel JS instance. Note that disabling persistence will disable the use of super properties
+ and anonymous -> identified user tracking.
+
+
+
+ If a user opts out of tracking, you can call the `.optOutTracking()` method on any of our
+ client-side SDKs; this prevents any subsequent data being tracked from that user's device.
+ Learn more [here](/docs/privacy/protecting-user-data).
+
+ For iOS specifically: Mixpanel does not use IDFA, so it does not require user permission
+ through the AppTrackingTransparency(ATT) framework. For more details, refer to our
+ [Apple App Developer Privacy Guidance](https://mixpanel.com/legal/app-store-privacy-details).
+
+
+
diff --git a/pages/docs/quickstart/tips-and-tricks.mdx b/pages/docs/quickstart/tips-and-tricks.mdx
new file mode 100644
index 0000000000..d638e2f72c
--- /dev/null
+++ b/pages/docs/quickstart/tips-and-tricks.mdx
@@ -0,0 +1,78 @@
+# Tips and Tricks
+
+You can use Mixpanel's SDKs to track events from your website, web application, or backend servers. We [recommend](/docs/tracking-methods/choosing-the-right-method) server-side tracking, since it is more reliable and easier to maintain than web/mobile tracking.
+
+Note: You'll need your Project Token to authenticate, which you can get [here](https://mixpanel.com/settings/project).
+
+
+## Step 1: Install the SDK
+
+## FAQ
+
+export function FAQBox({ title, children }) {
+ return (
+
+
+ {title}
+
+
{children}
+
+ )
+}
+
+
+ Yes, if you pass `track_pageview: true` in the `mixpanel.init()` call,
+ Mixpanel will automatically track a "Page View" event every time a new
+ page is loaded.
+ Learn more [here](/docs/tracking-methods/sdks/javascript#tracking-page-views).
+
+
+
+ If tracking from web, make sure you've disabled ad blockers and your Do Not Track (DNT)
+ browser settings are set to false when testing your JavaScript implementation. If
+ the DNT setting is set to true, then Mixpanel won't collect information from that Mixpanel
+ instance. We also recommend [setting up a proxy server](/docs/tracking-methods/sdks/javascript#tracking-via-proxy)
+ so that you don't lose events due to ad-blockers.
+
+ If tracking from a mobile device, events may take 1-2 minutes to appear because Mixpanel's
+ mobile SDKs buffer events for 1 minute, or when the app transitions to the background, to
+ conserve battery life and bandwidth. You can call `.flush()` in the mobile SDKs to manually flush events to Mixpanel.
+
+
+
+ If a user opts out of tracking, you can call the `.optOutTracking()` method on any of our
+ client-side SDKs; this prevents any subsequent data being tracked from that user's device.
+ Learn more [here](/docs/privacy/protecting-user-data).
+
+ For iOS specifically: Mixpanel does not use IDFA, so it does not require user permission
+ through the AppTrackingTransparency(ATT) framework. For more details, refer to our
+ [Apple App Developer Privacy Guidance](https://mixpanel.com/legal/app-store-privacy-details).
+
+
+
+ No, our Mixpanel JavaScript SDK does not set or use any third-party cookies. If you wish
+ to disable cookies entirely, you can set the disable_persistence option to true when initializing
+ your Mixpanel JS instance. Note that disabling persistence will disable the use of super properties
+ and anonymous -> identified user tracking.
+
+
+
+ When tracking on web, we recommend using localStorage, as this is more reliable:
+
+```javascript
+mixpanel.set_config({ persistence: "localStorage" });
+```
+
+
+
+If tracking client-side, just call `.identify()` when a user logs in and `.reset()`
+ when they log out. Mixpanel will automatically stitch the user journey across
+ logged out and logged in.
+
+ If tracking server-side, check out our [server-side best practices guide](/docs/best-practices/server-side-best-practices).
+ For more information, read our comprehensive guide on [Identifying Users](/docs/tracking-methods/id-management/identifying-users).
+
+
diff --git a/pages/docs/quickstart/track-events.mdx b/pages/docs/quickstart/track-events.mdx
new file mode 100644
index 0000000000..9d10e35917
--- /dev/null
+++ b/pages/docs/quickstart/track-events.mdx
@@ -0,0 +1,324 @@
+# Track Events
+
+import { Tab, Tabs } from 'nextra-theme-docs'
+
+import ExtendedButton from '/components/ExtendedButton/ExtendedButton';
+import ExtendedTabs from '/components/ExtendedTabs/ExtendedTabs';
+
+import { dataItems } from '/utils/constants';
+
+## Overview
+
+This step introduces the `track` method, which allows you to see how your users are using your product.
+
+Use the track method to track events on behalf of your users. Add this code snippet to basic events like "Sign Up" and any additional events that may track the core features of your product.
+
+## Code
+
+Replace `Sign Up` with a unique identifier for the event. Passing additional information is possible using the properties object.
+
+
+
+
+```js Javascript
+mixpanel.track('Sign Up', {
+ 'Signup Type': 'Referral'
+})
+```
+
+🎉 Congratulations, you've tracked your first event! You can see it in Mixpanel via the [Events page](https://mixpanel.com/report/events).
+
+**More resources:**
+ * Video: [Debug Common Issues When Installing Mixpanel on Web](https://www.loom.com/embed/fbba03274dc441b49b578e8a734b1d99).
+ * Docs: [Read the Full Javascript SDK Docs](/docs/tracking-methods/sdks/javascript/)
+ * Github: [Browse the Open Source SDKs](https://github.com/mixpanel)
+
+
+
+```python Python
+# Note: you must supply the USER_ID
+mp.track('USER_ID', 'Sign Up', {
+ 'Signup Type': 'Referral'
+})
+```
+
+🎉 Congratulations, you've tracked your first event! You can see it in Mixpanel via the [Events page](https://mixpanel.com/report/events).
+
+**More resources:**
+ * Docs: [Read the Python SDK Doc](/docs/tracking-methods/sdks/python/)
+ * Github: [Browse the Open Source SDKs](https://github.com/mixpanel)
+
+
+
+```js Node.js
+// Note: you must supply the USER_ID
+mixpanel.track("Sign Up", {
+ distinct_id: "USER_ID",
+ "Signup Type": "Referral",
+});
+```
+
+🎉 Congratulations, you've tracked your first event! You can see it in Mixpanel via the [Events page](https://mixpanel.com/report/events).
+
+**More resources:**
+ * Docs: [Read the Node.js SDK Doc](/docs/tracking-methods/sdks/nodejs/)
+ * Github: [Browse the Open Source SDKs](https://github.com/mixpanel)
+
+
+
+```go Go
+exampleEvent = mp.NewEvent("Sign Up", "USER_ID", map[string]any{
+ "Signup Type": "Referral",
+})
+
+err := mp.Track(ctx,
+ []*mp.PeopleProperties{
+ exampleUser,
+ },
+)
+```
+
+🎉 Congratulations, you've tracked your first event! You can see it in Mixpanel via the [Events page](https://mixpanel.com/report/events).
+
+**More resources:**
+ * Docs: [Read the Go SDK Doc](/docs/tracking-methods/sdks/go/)
+ * Github: [Browse the Open Source SDKs](https://github.com/mixpanel)
+
+
+
+```ruby Ruby
+# Note: you must supply the USER_ID
+mp.track('USER_ID', 'Sign Up', {
+ 'Signup Type' => 'Referral'
+})
+```
+
+🎉 Congratulations, you've tracked your first event! You can see it in Mixpanel via the [Events page](https://mixpanel.com/report/events).
+
+**More resources:**
+ * Docs: [Read the Ruby SDK Doc](/docs/tracking-methods/sdks/ruby/)
+ * Github: [Browse the Open Source SDKs](https://github.com/mixpanel)
+
+
+
+
+```java Java
+import com.mixpanel.mixpanelapi.ClientDelivery;
+
+// You can send properties along with events
+JSONObject props = new JSONObject();
+props.put("Signup Type", "Referral");
+
+// Create an event
+JSONObject sentEvent = messageBuilder.event(userId, "Sign Up", props);
+
+ClientDelivery delivery = new ClientDelivery();
+delivery.addMessage(sentEvent);
+
+// Send the update to mixpanel
+MixpanelAPI mixpanel = new MixpanelAPI();
+mixpanel.deliver(delivery);
+```
+
+🎉 Congratulations, you've tracked your first event! You can see it in Mixpanel via the [Events page](https://mixpanel.com/report/events).
+
+**More resources:**
+ * Docs: [Read the Java SDK Doc](/docs/tracking-methods/sdks/java/)
+ * Github: [Browse the Open Source SDKs](https://github.com/mixpanel)
+
+
+
+```javascript
+mixpanel.track("Sign Up", {
+ "Signup Type": "Referral"
+})
+```
+
+🎉 Congratulations, you've tracked your first event! You can see it in Mixpanel via the [Events](https://mixpanel.com/report/events) page.
+
+**More resources:**
+ * Docs: [Read the React Native SDK Doc](/docs/tracking-methods/sdks/react-native/)
+ * Github: [Browse the Open Source SDKs](https://github.com/mixpanel)
+
+
+
+```java
+mixpanel.track('Sign Up', {
+ 'Signup Type': 'Referral'
+});
+```
+
+🎉 Congratulations, you've tracked your first event! You can see it in Mixpanel via the [Events](https://mixpanel.com/report/events) page.
+
+**More resources:**
+ * Docs: [Read the Flutter SDK Docs](/docs/tracking-methods/sdks/flutter/)
+ * Github: [Browse the Open Source SDKs](https://github.com/mixpanel)
+
+
+
+```objc
+[mixpanel track:@"Signed Up" properties:
+ @{ @"Signup Type": @"Referral" }
+];
+```
+
+🎉 Congratulations, you've tracked your first event! You can see it in Mixpanel via the [Events](https://mixpanel.com/report/events) page.
+
+**More resources:**
+ * Docs: [Read the iOS (Objective-C) SDK Doc](/docs/tracking-methods/sdks/ios/)
+ * Github: [Browse the Open Source SDKs](https://github.com/mixpanel)
+
+
+
+```swift
+Mixpanel.mainInstance().track(event:"Sign Up", properties: [
+ "Signup Type": "Referral",
+])
+```
+
+🎉 Congratulations, you've tracked your first event! You can see it in Mixpanel via the [Events](https://mixpanel.com/report/events) page.
+
+**More resources:**
+ * Docs: [Read the iOS (Swift) SDK Doc](/docs/tracking-methods/sdks/swift/)
+ * Github: [Browse the Open Source SDKs](https://github.com/mixpanel)
+
+
+
+```java
+JSONObject props = new JSONObject();
+props.put("Signup Type", "Referral");
+mp.track("Signed Up", props);
+```
+
+🎉 Congratulations, you've tracked your first event! You can see it in Mixpanel via the [Events](https://mixpanel.com/report/events) page.
+
+**More resources:**
+ * Docs: [Read the Android SDK Doc](/docs/tracking-methods/sdks/android/)
+ * Github: [Browse the Open Source SDKs](https://github.com/mixpanel)
+
+
+
+```csharp
+var props = new Value();
+props["Signup Type"] = "Referral";
+Mixpanel.Track('Sign up', props);
+```
+
+🎉 Congratulations, you've tracked your first event! You can see it in Mixpanel via the [Events](https://mixpanel.com/report/events) page.
+
+**More resources:**
+ * Docs: [Read the Unity SDK Doc](/docs/tracking-methods/sdks/unity/)
+ * Github: [Browse the Open Source SDKs](https://github.com/mixpanel)
+
+
+
+If you don't see an SDK or an integration in your language, you can send events to our API directly.
+
+Here's a sample script. Replace `YOUR_TOKEN` with your project token. You can find your token [here](https://mixpanel.com/settings/project).
+
+```python test.py
+# Fill this out
+import json
+import time
+import requests
+
+events = [
+ {"event": "my_test_event", "properties": {"time": int(time.time()), "distinct_id": "test_user_1", "$insert_id": "04ce0cf4-a633-4371-b665-9b45317b4976", "city": "San Francisco"}},
+ {"event": "another_event", "properties": {"time": int(time.time()), "distinct_id": "test_user_2", "$insert_id": "3b033b9a-6bc9-4b70-90c3-a53e11f6896e", "city": "Seattle"}}
+]
+resp = requests.post(
+ "https://api.mixpanel.com/import",
+ params={"strict": "1"},
+ auth=("YOUR_TOKEN", ""),
+ headers={"Content-Type": "application/json"},
+ data=json.dumps(events)
+)
+
+print(resp.json())
+```
+
+🎉 Congratulations, you've tracked your first event! You can see it in Mixpanel via the [Events](https://mixpanel.com/report/events) page.
+
+See our [API reference](https://developer.mixpanel.com/reference/events) for more details.
+
+**Best Practices for Scale**
+
+You can use this API at scale, for example to backfill historical data into Mixpanel or as part of a high-throughput streaming pipeline. We provide walkthroughs for [Amazon S3](/docs/data-pipelines/integrations/amazon-s3) and [Google Cloud Storage](/docs/data-pipelines/integrations/google-cloud-storage) to provide a more production-grade example of how to use this API at scale.
+
+Here are some other best practices:
+
+- Be explicit about what is tracked to Mixpanel rather than implicitly tracking everything, both for performance and security reasons. Avoid sending user generated content, high-cardinality IDs, or large semi-structured objects.
+- Import a more recent time window first (last 7 days or last 30 days) before backfilling historical data. Mixpanel's autocomplete menus populate events and properties based on the last 30 days of data, so this is the best way to test that data looks as expected.
+- Leverage batching and compression. Each request to /import can send 2000 events to Mixpanel and can be sent compressed using gzip. The sample code in this guide does both.
+- When using Cloud Storage, partition files into ~200MB of JSON (or ~200K records) each. Each file is processed in parallel by Cloud Functions/Lambda and must be ingested by the function within the configured timeout.
+- Log any 400 errors returned by the API. These are non-retryable and indicate something malformed with the data. This should be extremely unlikely once the API is up and running. If a batch contains a mix of valid and invalid data, we will ingest the valid data.
+
+**Limits**
+
+Our Import API is built to ingest billions of events per day across our customers. That said, we do rate limit at very high scale to ensure quality of service and real-time ingestion. Please refer to our [Import API docs](https://developer.mixpanel.com/reference/import-events) for details.
+
+All of our sample code transparently retries and backoff from rate limit exceptions. If you require a higher-limit for a 1-time backfill, please reach out to us at apis@mixpanel.com.
+
+
+
+
+
+
+{/* Next Section */}
+
+
+
+
+
+
You're Ready to Start Using Mixpanel
+
It's time to create your first [report](/docs/reports/overview) or use one of our [many templates](/docs/boards/templates).
+
+
+
+
+{/*
+
+
Optional: Tips & Tricks
+
Once you've implemented the `identify` and `track` methods and are sending events, you're ready to learn some best practices to get the most out of Mixpanel.
+
+ )
+}
+
+
+ Yes, if you pass `track_pageview: true` in the `mixpanel.init()` call,
+ Mixpanel will automatically track a "Page View" event every time a new
+ page is loaded.
+ Learn more [here](/docs/tracking-methods/sdks/javascript#tracking-page-views).
+
+
+
+ If tracking from the web, make sure you've disabled ad blockers and your Do Not Track (DNT)
+ browser settings are set to false when testing your JavaScript implementation. If
+ the DNT setting is set to true, then Mixpanel won't collect information from that Mixpanel
+ instance. We also recommend [setting up a proxy server](/docs/tracking-methods/sdks/javascript#tracking-via-proxy)
+ so that you don't lose events due to ad-blockers.
+
+ If tracking from a mobile device, events may take 1-2 minutes to appear because Mixpanel's
+ mobile SDKs buffer events for 1 minute, or when the app transitions to the background, to
+ conserve battery life and bandwidth. You can call `.flush()` in the mobile SDKs to manually flush events to Mixpanel.
+
\ No newline at end of file
diff --git a/pages/docs/quickstart/what-to-track.md b/pages/docs/quickstart/what-to-track.md
deleted file mode 100644
index aaeb490786..0000000000
--- a/pages/docs/quickstart/what-to-track.md
+++ /dev/null
@@ -1,64 +0,0 @@
-# What to Track?
-
-It takes less than 5 minutes to track events to Mixpanel. In this guide, we provide some guidance on what to track and how to track it.
-
-## What to Track
-We recommend starting with just two events, which can provide a lot of value with little effort.
-
-### Step 1: Track a Sign Up event
-Track a Sign Up event when a user creates an account.
-```javascript
-mixpanel.track('Sign Up')
-```
-
-Tracking Sign Up is a quick way to understand your product's growth; by counting the number of Sign Ups, you can answer "How many new users am I acquiring every day, week, and month?"
-
-### Step 2: Track a Value Moment event
-Track a Value Moment event when a user reaches value in your product. Here are some examples:
-* Social: Post Created, Friend Added
-* E-Commerce: Purchase Completed
-* Media: Video Watched, Article Read
-* SaaS: Document Created, Call Started
-
-You can track a value moment with the following code snippet:
-```javascript
-// Replace the name with something that makes sense for your product
-mixpanel.track('Video Watched')
-```
-
-Tracking a value moment can help answer questions like:
-* How many users experience value in my product each day/week/month?
-* How many users come back (retain) and experience the value moment again?
-* What % of users that Sign Up make it to the Value Moment within their first day?
-
-#### Optional: Include Properties
-Properties provide added context to the event. Learn more [here](/docs/data-structure/events-and-properties).
-
-Extending the above example, you might add the following properties:
-```javascript
-mixpanel.track('Video Watched', {
- 'Genre': 'Comedy',
- 'Watch Time (seconds)': 200,
- 'Paid': true,
-});
-```
-
-Properties let you answer questions like:
-* What is the most popular genre that users watch?
-* How many users watched more than 10 minutes in their first session?
-* Which of my paid content gets the most views?
-
-### Step 3: Use the events in our Company KPIs Template
-Once you've tracked these two events, you can use our [Company KPIs Template](https://mixpanel.com/project?show-event-translator=true) to generate nine unique reports in a few clicks!
-
-🎉 Congrats on building your first Mixpanel Board!
-
-## How to Track
-There are two methods of tracking:
-* **Server-Side (Recommended):** In this method, you send events from your servers to Mixpanel. This approach is the most reliable and easy to maintain, since it lives in an environment that you control. It also means that you can add tracking in one place (your servers) rather than in 3 places (web, iOS, Android), which keeps tracking unified and clean. See our [quickstart](/docs/quickstart/connect-your-data) and [best practices](/docs/best-practices/server-side-best-practices) for more details on effective server-side tracking.
-
-* **Client-Side:** In this method, events are generated on the client device and sent to the Mixpanel API. There are two types of client-side tracking: web (Javascript) and mobile. This is less reliable than server-side due to ad-blockers. It's also harder to update tracking, since it might involve redeploying your app to web and mobile clients. You can improve reliability of client-side tracking using a [proxy](/docs/tracking-methods/sdks/javascript), but this takes more effort.
-
-We recommend tracking everything you possibly can via your servers, and only supplementing that with client-side tracking when necessary.
-
-Note: If you already track events via a CDP, Tag Manager, or via your DWH using something like Snowplow, you can route those events to Mixpanel with our native integrations. See the [Segment](https://segment.com/docs/connections/destinations/catalog/actions-mixpanel/), [Rudderstack](https://rudderstack.com/integration/mixpanel/), or [GTM](https://github.com/mixpanel/mixpanel-gtm-template#readme) docs for a walkthrough. We can also load data directly from data warehouses like [Snowflake](/docs/tracking-methods/data-warehouse/snowflake) and [BigQuery](/docs/tracking-methods/data-warehouse/bigquery).
diff --git a/pages/docs/reports/flows.mdx b/pages/docs/reports/flows.mdx
index 95d8d20124..83b8699443 100644
--- a/pages/docs/reports/flows.mdx
+++ b/pages/docs/reports/flows.mdx
@@ -26,9 +26,6 @@ Building a Flows report follows the same high level steps as building any other
Building a report in Flows takes just a few clicks, and results arrive in seconds. Let's build a simple report together. Using a B2B messaging example, imagine you wanted to answer the following question:
> What are the top paths leading Chrome users from Landing Page to Sign Up?
->
-
-Feel free to follow along and create your own report right in our demo project, [here](https://mixpanel.com/register/?next=%2Fproject%2F2195193%2Fview%2F139237%2Fapp%2Fflows). To skip ahead and see the final result, click [here](https://mixpanel.com/register/?next=%2Fproject%2F2195193%2Fview%2F139237%2Fapp%2Fflows%3Fredirect%3Dreport%2F11944961%2Flanding-signup-on-chrome).
### Step 1: Choose Events
diff --git a/pages/docs/tracking-best-practices/distinct-id-limits.md b/pages/docs/tracking-best-practices/distinct-id-limits.md
index b2578787e5..99c4da0dc0 100644
--- a/pages/docs/tracking-best-practices/distinct-id-limits.md
+++ b/pages/docs/tracking-best-practices/distinct-id-limits.md
@@ -47,7 +47,7 @@ The process can be broken down into 3 main steps:
* (Optionally) Fix historical data via exporting, transforming and re-importing the data
### Reviewing hot shard data in your project
-A great starting point for the analysis would be to create a copy of [this board](https://mixpanel.com/project/2195193/view/139237/app/boards/#id=5651541) from our demo project into the affected project. As you open the board linked above, you will see instructions to click on "Use this board" to transfer it over to your project and to edit the default date range.
+A great starting point for the analysis would be to create a copy of [this board](https://mixpanel.com/project/3187769/view/3699049/app/boards#id=7145081) from our demo project into the affected project. As you open the board linked above, you will see instructions to click on "Use this board" to transfer it over to your project and to edit the default date range.
![Screenshot use this board](/tracking_id_limits_copy_board.png)
diff --git a/pages/docs/tracking-methods/integrations.mdx b/pages/docs/tracking-methods/integrations.mdx
new file mode 100644
index 0000000000..18170dd989
--- /dev/null
+++ b/pages/docs/tracking-methods/integrations.mdx
@@ -0,0 +1,32 @@
+# Integrations
+
+import { Card, Cards } from 'nextra/components'
+
+These integrations allow you to send your tracking data to Mixpanel. If you don't see what
+you're looking for [reach out to us](https://mixpanel.com/get-support).
+
+### Featured Integrations
+
+
+
+
+
+
+### All Integrations
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/pages/docs/tracking-methods/sdks/_meta.json b/pages/docs/tracking-methods/sdks/_meta.json
index 4cab2074b2..66eee2d2d0 100644
--- a/pages/docs/tracking-methods/sdks/_meta.json
+++ b/pages/docs/tracking-methods/sdks/_meta.json
@@ -2,7 +2,7 @@
"javascript": "Javascript",
"react-native": "React Native",
"android": "Android",
- "ios": "iOS (Objective C)",
+ "ios": "iOS (Objective-C)",
"swift": "iOS (Swift)",
"flutter": "Flutter",
"unity": "Unity",
diff --git a/pages/docs/tracking-methods/sdks/ios.md b/pages/docs/tracking-methods/sdks/ios.md
index 4a6a1ab6ea..e2e38e2261 100644
--- a/pages/docs/tracking-methods/sdks/ios.md
+++ b/pages/docs/tracking-methods/sdks/ios.md
@@ -1,4 +1,4 @@
-# iOS
+# iOS (Objective-C)
## Getting Started
diff --git a/pages/docs/tracking-methods/sdks/swift.md b/pages/docs/tracking-methods/sdks/swift.md
index 9b050f305b..9281b894ce 100644
--- a/pages/docs/tracking-methods/sdks/swift.md
+++ b/pages/docs/tracking-methods/sdks/swift.md
@@ -1,4 +1,4 @@
-# Swift
+# iOS (Swift)
## Getting Started
diff --git a/pages/docs/users/cohorts.md b/pages/docs/users/cohorts.md
index 66e38aa12e..dac5310a8d 100644
--- a/pages/docs/users/cohorts.md
+++ b/pages/docs/users/cohorts.md
@@ -1,4 +1,4 @@
-# Overview
+# Cohorts
Cohorts are groups of users that share a certain set of properties or who perform a similar sequence of events. Mixpanel lets you visually define cohorts, view the list of users that comprise them, compare them in your analysis, and share them with the rest of your company.
diff --git a/pages/docs/what-is-mixpanel.mdx b/pages/docs/what-is-mixpanel.mdx
index d23c252bc7..f8fafe46ac 100644
--- a/pages/docs/what-is-mixpanel.mdx
+++ b/pages/docs/what-is-mixpanel.mdx
@@ -1,9 +1,14 @@
-# What Is Mixpanel?
+# What is Mixpanel?
-Mixpanel is an analytics tool that enables you to capture data on how users interact with your digital product. Mixpanel then lets you analyze this data with simple, interactive reports that let you query and visualize the data with just a few clicks.
+import ExtendedButton from '/components/ExtendedButton/ExtendedButton'
-Our self-serve interface empowers your team to answer questions, no matter their data expertise.
-
+Mixpanel will help you better understand your customers and answer questions about your product.
+It enables you to track how users engage with your product and analyze this data with interactive reports
+that let you query and visualize the results with just a few clicks.
+
+Mixpanel is built on three key concepts: [**Events**](#events), [**Users**](#users), and [**Properties**](#properties).
+
+