Show HN: Tenno – Markdown and JavaScript = a hybrid of Word and Excel
tenno.appTenno is a web app that lets you create Markdown documents that can include computational cells. You can think of it as a mix of Word and Excel, some sort of "literate programming" environment.
This is still an early version but I wanted to get some feedback from HN on what could be nice features to add.
Check out the Docs and examples page, it has a ton of (in my humble opinion) cool stuff!
Why did I build this? I was building some estimation for cloud costs in Google Sheets and I quickly ended up with a mess. I realized that if I wanted to analyze how a certain thing changes wrt to multiple variables by plotting it, I had to create a bunch of copies of data and copy my formulas everywhere... a SWE nightmare!
Tenno simplifies this because you can essentially define a function you are interested in, and only the analyzing it using plots that explore various dimensions.
BTW, you can also use Tenno to build dashboards by pulling data from APIs, checkout the weather data example.
I love the idea of finding new and better interfaces for spreadsheets, and I applaud this effort!
That being said, if you want this to be useful for people in general, not just programmers:
- People like WYSIWIG. Markdown and the split-pane view seems to be something only programmers like. So I'd suggest being able to do everything, or mostly everything, directly in the rendered/HTML panel. (Maybe the Markdown panel is for power users only)
- This is great for working with individual calculations, but a lot (most?) of spreadsheet use is about applying formulas to whole rows, columns, and tables of values. I see you support basic tables, but they're a huge pain to encode/format/edit in Markdown, and I don't see any ability to support things like 200 rows x 5 columns and do things like calculate sums and averages
So I think there's a ton of potential here! But I think WYSIWIG and easy tabular data support are going to be key here for broader usage. While the kinds of programmers this seems aimed at now, are already using Jupyter notebooks and Matplotlib for this kind of thing. (Like, when you describe "why did I build this", I don't understand why you didn't just fire up a Google Colab notebook.)
Tables are something I want to tackle and I'd like to do them right because (as you point out) are crucial. I didn't get there yet...
I want to make it such that you can code on the left and then hide everything and share that with non technical folks. That's why I did not use a Colab, creating something interactive with it (and I did that quite a lot in the past) it's a bit of a PITA.
As a well seasoned web developer, when I'm doing front-end, there are always 2 big problems: Data tables and loading indicators (fun way of saying it's hard to tackle lazy loading without a request waterfall).
The second problem has had good attempts in the recent years, but no single web application can beat excel in terms of data tables (while not 100% relevant anymore, I really like the super light introduction here from Joel Spolsky: https://www.youtube.com/watch?v=JxBg4sMusIg )
I highly suggest that you look at both Org mode table formats, one of them almost certainly has much of the UI and features you are targeting.
fwiw:I don't think WYSIWYG is that useful here. It'll by its nature appeal to a crowd that's more technical than the average user. (You won't replace Excel day 1)
There's also the fact that if this is supposed to become more than a design exploration, it might be useful to focus on what this can do that spreadsheets can't - a WYSIWYG editor for spreadsheets is just a spreadsheet.
And I definitely think there's something good here, and that is not a spreadsheet or a colab notebook. It's worth digging into what that might be.
The large tables issue might be solvable with Emacs. Org mode had two table formats, one of which is a veritable spreadsheet. It's all text under the hood, but Emacs (at least with Evil) provides a easy interface to create and populate rows, columns, and cells.
to your first point i think its a good idea to offer both if possible. Like hide the code behind an interface wysiwig-style but give users the option to also edit the code directly if they want to
These are basically block editors. The problem is more, regular users just arnt going to be doing it period.
It's basically a pyramid problem:
1 programmer will program all the things
2 power users will create all the forms from pieces of the programmers documents
999+ will use the output and never care about any of the rest
There's just minimal middle ground, and the only answer is to cater to all three but in Different ways
I've been writing something similar that keeps evolving, although computable code blocks and markdown have been in there since v1. Runs locally, saves to LocalStorage and is always in a partially broken state because I add more things than those I fix: https://github.com/rberenguel/weave
And a couple recent-ish updates (sadly twitter, because I use it as throw-devlog-there):
- https://x.com/berenguel/status/1837917590804451378?s=46&t=jc...
- https://x.com/berenguel/status/1799770200310726731?s=46&t=jc...
- https://x.com/berenguel/status/1796917242791113118?s=46&t=jc...
Nice work!
I did another take on this, that extends Markdown links to include types (like triples, like Semantic Mediawiki) called "mdld". It's quite powerful but I left it at a good-enough stage for my uses. https://github.com/vid/mdld
A beautiful concept. Thank you for sharing.
Really nice job, the emphasis on local+live execution is much appreciated.
I’ve spent some time working on something like this and ended up in a Turing tarpit, I hope you are able to avoid that fate.
The questions I let myself avoid for too long was, who is my user, and what are they trying to accomplish? How technical are they?
Once I answered those (on year 2, after running out of money) I built the same capabilities into a very different offering. Still with the goals of local, live, executable docs, but you wouldn’t recognize it.
Thanks! That's why I posted this here to see if people would resonate with this or not... I've only worked a couple of weeks on this and I had the same questions!
Can I ask what you ended up building? Is there a website for it?
This is a great concept. I'd love for this to be a part of a notetaking solution that I can run locally.
Curious what your long term plans are.
I am also curious if it supports taking (entire) tables as inputs and creating derived tables from them which can then be presented as chart etc. That would be really powerful.
I was trying to get a sense of what people like and find useful. Your suggestions and comments are helping to figure that out.
I am planning to add support for entire tables, like one coming from a gSheet, and then present data from it. But not there yet, if you have suggestions, please add them to the feedback form https://forms.gle/A8Q8WAG8zj4sLvwQ7
It would be cool if you could run SQL queries against lcoal SQLite or DuckDB instances and generate tables
Was looking into local DuckDB notebooks and found this: https://www.duckbook.ai/
I'm not knocking it. At first glance this reminds me of a notebook like Jupyter. Was that an inspiration here? Also, how would you say this stacks up in terms of sharing these files and/or running them locally? Thanks.
Edit: after seeing this, I kind of wish Jupyter worked with markdown exactly like this. Jupyter's GUI-oriented blocks jammed into my VSCode workspace always felt unnecessarily clunky to me.
The idea was to have a more linear way to express your thoughts and adding calculations. Another big problem for me was that in excel when you want to create various plots for the same multi-variate problem you have to create a ton of copies of your data and formula.
For sharing files, it could be as simple as sharing a text file. You can also imagine a future where you create something and you only share the nice looking html view that is still interactive.
Running locally? not a problem, I already tested packaging this into a OSX app and it was like 4MB and has the same functionalities.
Check this out:
Soulver - https://soulver.app
Notepad, meet calculator...
Soulver is a natural language notepad calculator app for the Mac, iPad & iPhone.
It is a better way to work things out than a traditional calculator, and a more lightweight tool for working through problems than a spreadsheet.
Here's an example from a real user:
https://x.com/hisaac/status/1355720844929019909
Nice, I saw this years ago!
Reminds me of Ink and Switch's Potluck: https://github.com/inkandswitch/potluck but this has way better DX / is way easier to use
Reminds me of https://evidence.dev/
nice I did not know about this, thanks for sharing!
I'm one of the founders of Evidence. Tenno looks fantastic, there are a lot of great ideas in there. I also really like what you've done w/ the side-by-side code examples in your docs.
Here's our launch HN in case you're interested: https://news.ycombinator.com/item?id=28304781
Happy to chat anytime. adam at evidence.dev
Tenno is the name of the faction in the video game Warframe the player characters are comprised of. Just want to point that out.
Cool, didn't know that, but I can assure you it's also the name of a lake close to where I live
Make sure to always google a name you want to use before using it, to make sure you're not going to get clobbered by someone else's dominant SEO on the word.
Actually I did some very simple search and most results were about my local lake, so I figured that the context was different enough, we'll see.
That's personalized search results for you :) That lake would not be ranking high for anyone except the people in the vicinity.
Might search also using eu.startpage.com, Qwant, …and Kagi if you have it.
(( Tenno is also a Japanese word usually translated as "emperor". ))
This was my first thought, probably will make searching stuff difficult.
Should not be too bad. The two are different enough that you can add some sort of context to your search terms, like searching for "tenno markdown".
It’s also the Japanese Emperor.
Reminds me of the "Pipedream" package on the old Cambridge Z88 laptop
https://en.wikipedia.org/wiki/Cambridge_Z88
It had a combined spreadsheet/word processor. No, not as separate modules like Microsoft Works and so on, but like this, as a single program where documents had both functionalities.
I want to commend the developer of Tenno, because this is a great idea and I've thought of it myself in the past.
As the developer of a wiki app of my own, I've been doing block-based (cell-based editors, like Jupyter) editors for literally decades. I've also considered adding calculation capabilities into my CMS so that it becomes a hybrid between a wiki tool and a spreadsheet as well.
Jupyter Notebooks is a nice thing that's got similar capabilities but what the world really needs most is just a simple extension to the Markdown format itself.
So while Tenno may be cool, what's even more important is that the world settle in on a syntax that can embed calculations into markdown. Because the Jupyter file format (although it may be great for what it does) is just too complex for general purpose use in the way Markdown is used.
Sounds similar to emacs org mode where you have markup and tables can have Elisp formulas in them.
Yeah, that's what I was thinking.
deepmacro, before you created Tenno, did you try Org? It supports plain text spreadsheets[1] in Org documents whose content is marked up using Org syntax[2], which is a lightweight markup language like Markdown but with many more features. If you did try Org, how was it lacking?
[1] https://orgmode.org/manual/The-Spreadsheet.html
[2] https://orgmode.org/worg/org-syntax.html
i do my taxes with org spreadsheet i doubt it lacks and you also have the option to get output in html/pdf etc. with babel.
Honestly, no. I heard of it but I never used it. I am sure it has a lot of features that can inspire Tenno, I'll look more into it. One of the main points here was making it more approachable, but it depends on who the audience is.
Really nice project, is there some way we can follow the project to get news / updates? Btw, I live near Tenno lake in Trentino and It's always nice to see local folks sharing their projects, keep it up!
Hi there, thanks! Send your comments here https://forms.gle/A8Q8WAG8zj4sLvwQ7 and put your email in there, I will definitely reach out with updates. If you're up to it we could even meet sometimes for a coffee!
Daily Obsidian user here. I often need to do a bit of math or adding numbers in a column, and could be the target market for this, but I'm not sure yet.
I am confused about using Excel as a metaphor, and calling things "cells" -- Excel is all about cells and tables, but actually this is just "assigning variables and doing a bit of math inside of :: these blocks :: like a templating language.
Suggestion: just explain it like that to people?
As a feature request, I often have a list of values (in a column) and want to sum them. It'd be nice if I could write it and have it print the sum in the view/wysiwym mode. Eg:
:: 10,000 20,000 5,000 = total_expenses ::
(maybe it could ignore commas too :) )
Cool work, love seeing things in the markdown space!
Nice! mad nitpick, I feel like the Euro display filter is weird, as it renders "12.25€" whereas I'd expect a Euro value to be displayed "€12.25". I've never seen it with the euro sign at the end in my life! Maybe this is country-dependent?
Another one, the Editable filter is very cool, but every keypress seems to take focus away from the input, making it rather hard to edit a number in practice.
Regardless, I really like this! Of most similar attempts I've seen so far, this seems particularly ergonomic and up my alley. Great job!
Concerning the currency symbol positioning, yes, it is indeed country-dependent. Countries of the Commonwealth usually place the currency sign in front of the figure, but most european do not, and instead place the symbol after the figure.
See the Use section in https://en.wikipedia.org/wiki/Euro_sign
Thanks! I was always told the dollar is a prefix unit while the euro is not, but perhaps between european countries there are differences in that...
Anyway, yes the editable thing is a known problem that could be fixed by switching to a view mode rather than an edit mode. The problem right now is caused by keeping in sync the edit field and the code on the left side.
The dollar sign isn’t a prefix in many EU countries. It’s so weird to learn that currencies go first. Then again, I still don’t understand a single American measurement either so why wouldn’t it be weird? Seriously, I have no idea what a mile or a feet is. I’ve learned from time to time when I needed to, but I always forget again because it’s just not making any sense to me.
Or maybe it’s bit weird. Do you guys also put something like “ml” in front of numbers? Would it be: “you can buy 10ml of milk for $2”?
LOL, Americans don't do ml. It would be 1/8 fluid wainscot of milk or something.
I realize making fun of the imperial measurement system is a great internet pastime, but almost everything in America has measurements in both imperial and metric on the packaging. The can of soda I'm looking at says 12 fl oz, and then in parentheses it says 355 ml.
How many hot dogs is that?
> “you can buy 10ml of milk for $2”
That's expensive ass milk.
I understand this is a tradition and it is pointless to look for logic here, but I always wandered why dollar sign goes first when all other units go after the number.
What country are you from? In France it’s always at the end for example
In Italy it's at the end, hence my interpretation
In the Netherlands it is a prefix, at the beginning.
https://nl.m.wikipedia.org/wiki/Euroteken
Same in Germany. Definitely at the end here.
I had one more thought about this stuff today. As the developers of Tenno did you consider using some format like back-ticks based (r ``` or r `) where an "r" in front would mean "run" this code, instead of simply display it? That way it would display a normal markdown code (aside from the 'r') in editors that don't support Tenno syntax? Or maybe something in front of the backticks that always renders as invisible, like maybe some kind of XML like <r>?
How did it compare with https://observablehq.com/ ?
I'd have to look more into it, one thing for sure is that Tenno does not try to be something like Jupyter. The cells execution order is sorted out for you.
Specifically, this brings to mind Observable Framework, which takes the "jupyter-like" UI of observablehq.com and makes a static site generator out of it, where you write Markdown, and add "reactive Javascript" bits to it: https://observablehq.com/framework/. (see https://observablehq.com/framework/javascript specifically)
Note that there's nothing stopping you from embedding the Obervable runtime straight into scripts littered throughout a HTML document, see https://maxbo.me/celine/ (my own work).
I’m the lead dev on quarto.org. I’m aware - I designed and implemented our observablehq integration.
haha what a coincidence - I love Quarto and have used the Observable integration! Thank-you for your work and efforts.
Observable also handles the execution order for you.
Very nice.
There is no support for table cell expressions though, without which marking it as Excel is wrong.
There is VS Code extension I use now: https://github.com/cescript/MarkdownFormula
Do you consider adding something like that? Any way to use this locally? Is this going to be FOSS or no?
Thanks! Yeah, I kind of want to integrate with gSheets so you can have a place where you can dump the data and then operate on it.
Also need to find a nice and easy way to deal with local tables, I'll look into the extension you suggested.
The extension allows you to add calculation even between tables by naming them in the comment:
> gSheetsI am personally not interested in anything beyond my computer.
Great demo, reminds me a lot of Jupyter Notebook but the "inline" cells are so much better
As a developer and a writer,my suggestions are:
1.Support export rendered page to other format,e.g. html,pdf,png,svg 2.The above suggestion is about how to sharing with others.So it's good to procide a way to spread,e.g. every documents made can be viewed from a special url,if you want to make this be a platform. 3.Code blocks hightlighting.Suppose someone want to use teno like juptybook to share their research or other things,code highlight is the key for reading experience.
Thanks, great suggestions, and some of them were already on my todo list.
It's interesting that the literal programming mentioned in the description and in the comments is old, but it basically suggests making a text primarily intended for computers more human. What is new here imho is that the idea of extending markdown with programming features is doing the reverse. So, if you have some texts made for humans why not make it more algorithmic in nature. I think this idea might be more influential if we find more cases when it could shine.
Very cool! I'm working on something similar but a little more wysiwyg and collaborative (think gdocs meets gsheets rather than word meets excel). Let me know if you want to chat - email in profile
Thanks, I'll definitely reach out!
Can't work out if I like this or not.
There's something cool here, but I find the custom DSL very counter-intuitive. I'd much rather just type actual TypeScript or even Python than a half-way house.
So I guess while it's cool I think I'd rather just use full Jupyter (especially now it supports Deno)
Still an interesting project & thanks for sharing
You might be interested in the Handlebars integration[0] Microsoft recently added to their SemanticKernel AI SDK.
It's not identical to what you're doing, but there's considerable overlap and possibly some food for thought.
[0]https://medium.com/@shijotck/automating-tasks-with-semantic-...
I opened the docs page, tried editing one of the examples, the page immediately crashed. You may be interested in setting up some error boundaries between your components.
Right, I did not put a lot of checks in place for such failures. Does it keep happen if you refresh? I've never seen it TBH https://tenno.app/docs
Yup, still happens. The easiest way to reproduce it to change a title of one of the charts to `title=""` (make sure to type it, not copy-paste). I'm using Safari for macOS if this makes a difference.
Ah, yes, I just fixed that. While you edit, if the code is not valid now it will prevent from crashing the whole thing (band-aid fix).
This reminds me of Clerk, but I believe it's a tad more powerful: https://clerk.vision
Very cool! A couple first-blush bits of feedback:
- The editable text fields currently lose focus after each keypress
- Error handling will be a hard nut to crack, but currently if you, say, add "a" to an editable textbox that expects a number, the live component reverts to text
- Minimal support for buttons would add a lot for simple interactive charts - something like:
Neat, you might also look at https://speedrun.cc for ideas. It's a slightly different space, it's markdown to wrap tools with UI's instead of to plot things, but the way I enable you to prompt the user and run little bits of javascript might be of interest to you.
I think this would be great as an evolution of MDX (https://mdxjs.com/). MDX is already pretty popular for documentation and it plays well with React but unfortunately there is no framework that adds interactivity to MDX which will enable use cases like data applications.
Thank God for all these banners. Without them, the wars would probably still be going! Oh wait...
I wanted to check this out on my phone, but it is unfortunately impossible to even read the text on the page or look at the examples.
Yes, a responsive layout it's something I'll tackle in the future, but I think that in 90% of use cases people should use this on a laptop. Check it out again on a laptop if you can!
I can imagine having a secrets store whose contents can be embedded into API calls, either in the URL or in a header, would be pretty useful.
And looking further ahead, having a way to authenticate users via Okta etc with the usual gubbins of groups and permissions and personal areas and sharing URLs would no doubt give you uptake in corporate areas.
Very cool. I've always thought there's a lot of untapped potential in literate programming [0].
There are lots of reports and documents that should be this instead of static Word files.
[0] https://en.wikipedia.org/wiki/Literate_programming
I'd love to give it a try but in mobile it's unusable in portrait (default) phone orientation.
It would be great if it switched to top-bottom instead of left-right layout under certain width and/or aspect ratio.
First of all, I love this concept!
The editable fields within a markdown explainer is really intuitive.
What I'd personally like to see is a better data exploration tab or similar - basically some place that makes it easier to view the cells in use in the doc, and edit them. basically a spreadsheet tab ;)
Yeah, I think using the same concept you did for the charts, use that for the tabular info. I can imagine using those dash's and bars would eventually get annoying to create a decent size table.
I wonder whether something similar could be achieved with NuxtJs. It has something similar, where it allows you to refer to vuejs components from markdown and parametrize them.
It's pretty convinent
WHOA! this is awesome! love this so much, you definitely have me as a user for life.
Neat little tool. I was looking for Excel in the examples but only saw charts.
For Excel + Word I use coda.io. You can also quickly create equations with sliders for variables to satisfy similar needs as Tenno but I haven't tried charting with it yet.
Reminds me of my own `majsdown`: https://github.com/vittorioromeo/majsdown
Cool stuff!
This seems really cool although I’m not sure that I would call that a cell
I was hesitant to call it a variable because most people that only use excel are not going to be familiar with that concept. Suggestion for other names?
Vet cool! I've always wanted something like this in my note taking (currently use obsidian), but it being a "webapp" is kinda a deal breaker. I want something that runs and stores my data locally.
Well it's a web app but it's not using anything in the cloud at the moment, I experimented with packaging it in an app for Mac and works nice. If more people wanted it this could definitely be converted in something running locally where you can store .md files in your computer.
That would be great!
Good to hear! There is a form to collect feedback, feel free to add comments in there! https://docs.google.com/forms/d/e/1FAIpQLSf0senRYfIo_034Ukno...
You can do a lot of this in obsidian with the dataview and execute-code plugins!
Didn't know about this! Will look into it, one nice thing here is that you do not need "ordering" like in imperative programming when you define your cells.
Is that possible too in Obsidian? Or perhaps it's not useful...
It would be helpful to have a built-in bignum type. Excel’s usage of float is performant, but it is also a mistake. A complex number type would also be nice to have.
Excel, but linear, without the reference mess. It looks cool for mocking up dashboards. Some form of grid with nested documents could make it more useful.
+1 this! I think writing helps you create a narrative that disambiguates the mess you can create in Excel. It also forces you to think more about what you do. Good suggestions! Thanks
Easy on the features, though. If you make it too complex, it can lose its (fairly) unique proposition of simplicity.
You might want to add a horizontal split mode and use that by default depending on the resolution of the device (phones/tablets)
Good idea, thanks, I'd also like to prevent edit mode on mobile so one can only see the HTML rendered part.
I feel like disabling editing on mobile entirely might be going too far.
It's obviously your project, so you're free to do whatever you want, but if you prefer focusing on read only mode on phones, maybe you could consider a full screen/toggle mode instead (not split whatsoever - neither vertical nor horizontal), that let's you select editing or viewing mode - and it defaults to off / viewing?
Nice! What about integrations with Google sheets?
That seems quite doable but it would require a backend to store the OAuth
Public sheets don't require oauth, i am using public sheet as test url to display csv in my tool.
I've done this with org-mode. Most recently to tally miniature golf scores for me and my wife.
Absolutely brilliant. Bookmarked.
Glad you like, I'll keep you posted for new updates in case you're interested.
cool! When did you came up with this and how long you’ve worked at it?
The company security team at my workplace is blocking tenno.app as grayware :D
It can execute arbitrary JS in your browser using eval(), that could be why.
Interesting effort.. I'd just spin up a Jupyter Notebook instance, but hey.
Right, something that's potentially difficult with Jupyter is sharing something that looks nice with non technical folks where they can easily change values and see the result change immediately without having to execute cells.
Nice idea, could be a lightweight enough way to create some visualizations
Yeah, at the moment I only have line charts but I can add other charts using ChartJS. I also think it could be useful to share some initial prototypes with less technical folks.
The lotus will be pleased.
Sorry, but Excel is so great and the most loved software in the world because every user intuitively understands that the cells can be edited "right where they are". The markdown abstraction is nice, and probably has many usecases, but it's just not a hybrid of Word and Excel because it introduces an abstract language to describe cells and words.
(Anyway, great project engineering-wise!)
I think having to use a tool different than excel is hard because people have been used to that type of UI for 40 years.
The problem I have is that once you go beyond a simple thing it becomes messy and you never know what you are dealing with. The way you present things graphically and they way you organize data to perform computations are tangled, making hard to read IMO.
no, the real reason is the super wide range of things you can do in 3 clicks that other solution would require you to download external libraries and plugins and/or spend hours implementing it. People can be productive immediately and they never have to learn how to code or waste time configuring the interface and finding third party add-ons.
Simple stuff that you do everyday like sorting data and removing duplicates is probably not difficult to implement by an experienced programmer (eg. in python), but excel has it ready for you and it's a 2 click operation that a complete beginner can figure out on their own with no training, no coding skills and no documentation.
It's the same with Matlab, engineers don't pay for access to the m language, they pay for the toolboxes and the thousands of small QoL details in the UI like importing your data with a quick Ctrl+C/Ctrl+V.
> Excel is […] the most loved software
Citation needed.
Can this run locally?
At the moment it runs without an internet connection after you download it the first time
This is fantastic.
If you hate spreadsheets this could be your way out of it...
Thank you for sharing Tenno with the HN community! It's always exciting to see new tools that enhance productivity and bridge the gap between document creation and computational analysis.
Ah, like a reduced version of Org-Mode.
I hate to be that guy: Org mode did it.
(actually, I love pimping emacs)
interesting idea. try to understand the dsl for the chart but the doc is not very detailed
Org mode in JS?