Let's say you want to add a tweet button to your blog, so your readers could reach out to you. You do not want to include the twitter SDK either, because of privacy concerns. How will you do it?

![an illustration of a person holding a mobile phone](https://i.imgur.com/zNnBop0.jpg)

That's exactly the question I had when I replaced Disqus with Twitter as a way of interacting with my readers - how to add the ability for the readers to type in a message and tweet me without having any Twitter JavaScript files? Here's how solved it.

## Twitter web intent API

Luckily, Twitter has exposed a public API [https://twitter.com/intent/tweet](https://developer.twitter.com/en/docs/twitter-for-websites/tweet-button/guides/web-intent) through which you can compose and post a tweet via a link. Which means, if you have a link on your page with `href` set to [https://twitter.com/intent/tweet?text=hello](https://twitter.com/intent/tweet?text=hello), when the user clicks on the link, it will take user to Twitter page with the text pre-populated. Go ahead, give it a try - don't worry, nothing will be posted on your timeline until you explicitly tweet.

Along with `text` you can also pre-configure `url`, `via` and other attributes to pre-fill the twitter message. Here's a full list of all allowed [tweet intent parameters](https://developer.twitter.com/en/docs/twitter-for-websites/tweet-button/guides/web-intent).

## No link and no JavaScript either

If you looked at the [Twitter Web Intent](https://developer.twitter.com/en/docs/twitter-for-websites/web-intents/overview) overview page, they are asking to include teh twitter JavaScript files, which I don't want to do. I also don't want a pre-configured a link. Instead, I want a text box where the user could type in their message and then a tweet button.

![screenshot of a web form with a text box and a tweet button](https://i.imgur.com/rVMlNTU.png)

## Behold - the form

I am sure you would have heard about the `form` element - it was in the HTML 101. Honestly, after the web 2.0, I don't exactly remember when was the last time I meaningfully used a web form.

`Form` is the exact answer for my use case. The `form` element has an attribute called `action` - you can set a URL to the action attribute and then the contents of the form will be sent to the said URL. The default submission method of `form` is `GET` - which means the form values will be appended to the `action` URL as query parameters, which is what I want.

Now, all I have to do is to add a form, targeting Twitter web intent URL.

```jsx
<form action={"https://twitter.com/intent/tweet"}>
  <textarea
    placeholder={"type your message and click tweet button"}
    name="text"
  />
  <button type={"submit"}>Tweet To Author</button>
</form>
```

When the user type in a text and slick the submit button, the form will redirect the user to `https://twitter.com/intent/tweet?text=usermessage`. So far so good.

Next, if you wanted to pass in other parameters such as `url` or `via` or even a pre-configured `text` without user entering them - you can use `hidden` input elements.

```diff-jsx diff-highlight
  <form action={"https://twitter.com/intent/tweet"}>
+   
+   <input type={"hidden"} value={"vraa"} name="via" />

+   
+   <input type={"hidden"} value={postURL} name="url" />
    <textarea
      placeholder={"type your message and click tweet button"}
+      defaultValue={"Hey @vraa, "}
      name="text"
    />
    <button type={"submit"}>Tweet To Author</button>
  </form>
```

That'll do it - I now have a tweet button without including any Twitter JavaScript files!

Now why don't you try it out below? What do you think about this post, send me a tweet!

#tweet (1)