[{"data":1,"prerenderedAt":589},["ShallowReactive",2],{"project-44932651":3},{"id":4,"name":5,"line":6,"line_source":7,"title":8,"url":9,"domain":9,"maker":10,"posted_at":11,"year":12,"points":13,"comments":14,"rank_in_year":15,"shown_in_year":16,"top":17,"tier":18,"category":19,"subcategory":20,"format":21,"keywords":22,"reception":27,"sentiment":28,"stance_mix":29,"scored_comments":34,"aspects":35,"strip":45,"post_text":48,"what":49,"said":77,"maker_in_thread":230,"shape":235,"grid":238,"attempts":550,"same_week":551,"maker_shows":17,"maker_hidden":580,"reader_version":581,"card":582},"44932651","OverType","A Markdown WYSIWYG editor that's just a textarea","title","Show HN: OverType – A Markdown WYSIWYG editor that's just a textarea",null,"panphora",1755447186,2025,471,99,80,3837,3,"legend","dev_tools","markdown editor","library",[20,23,24,25,26],"textarea","wysiwyg","syntax highlighting","javascript","mixed",0.227,{"positive":30,"neutral":31,"mixed":32,"critical":33},28,23,6,14,71,{"design":36,"execution":38,"idea":40,"docs":42,"performance":44},{"positive":17,"critical":37},1,{"positive":37,"critical":39},5,{"positive":33,"critical":41},8,{"positive":43,"critical":43},0,{"positive":37,"critical":43},[17,43,17,17,39,17,39,39,37,17,37,17,17,17,37,37,46,39,39,39,39,39,17,39,17,46,39,37,37,17,17,43,17,47,39,39,39,39,43,39],2,4,"Hi HN! I got so frustrated with modern WYSIWYG editors that I started to play around with building my own.\n\nThe problem I had was simple: I wanted a low-tech way to type styled text, but I didn't want to load a complex 500KB library, especially if I was going to initialize it dozens of times on the same page.\n\nMarkdown in a plain \u003Ctextarea> was the best alternative to a full WYSIWYG, but its main drawback is how ugly it looks without any formatting. I can handle it, but my clients certainly can't.\n\nI went down the ContentEditable rabbit hole for a few years, but always came to realize others h",{"problem":50,"audience":56,"pricing":9,"motivation":61,"time_to_build":9,"stack":65,"openness":74,"stage":75,"team_size":76},{"value":51,"source":52,"evidence":53},"Rich markdown editing without a heavy WYSIWYG library or contentEditable complexity.","maker",[54],{"id":55},"post",{"value":57,"source":58,"evidence":59},"Developers and clients who need styled text input embedded in web pages.","inferred",[60],{"id":55},{"value":62,"source":52,"evidence":63},"Wanted a lightweight styled text editor without a 500KB library.",[64],{"id":55},[66,70],{"value":67,"source":58,"evidence":68},"JavaScript",[69],{"id":55},{"value":71,"source":52,"evidence":72},"HTML textarea",[73],{"id":55},"open_source","launched","solo",{"praise":78,"objections":91,"requests":133,"questions":175,"alternatives":197},[79],{"value":80,"source":81,"evidence":82},"Useful for embedding markdown editing in projects.","commenter",[83,87],{"id":84,"by":85,"text":86},"44938502","rakag","This is exactly what I need for my project :)",{"id":88,"by":89,"text":90},"44934432","nodesocket","Very cool. I’m gonna implement into my hobby project today and see how it goes.",[92,111,122],{"value":93,"source":81,"evidence":94},"Calling it WYSIWYG is misleading since it shows markdown symbols and is only syntax highlighting.",[95,99,103,107],{"id":96,"by":97,"text":98},"44940841","pwdisswordfishz","Calling it WYSIWYG is a misnomer: this is just syntax highlighting, it just so happens that the highlighting styles agree to an extent with the final rendering. And the idea is…",{"id":100,"by":101,"text":102},"44934844","garbageoverflow","If it were a WYSIWYG editor, there'd be previews for images. But it seems like it's just syntax highlighting for textareas. Nice project either way, but false advertising.",{"id":104,"by":105,"text":106},"44939625","clippyplz","WYSIWYG does not refer to the icons in the toolbar, but rather the text itself. This is not WYSIWYG because when I make something bold, I see a bunch of asterisks around it.…",{"id":108,"by":109,"text":110},"44938796","ricardobeat","Indeed it is a misuse of the term. An actual WYSIWYG editor would not show any of the formatting markers. By definition a “Markdown editor” cannot be WYSIWYG - you can have a…",{"value":112,"source":81,"evidence":113},"Requires monospace font, a drawback for non-technical audiences.",[114,118],{"id":115,"by":116,"text":117},"44935126","ikurei","Having to use a monospaced font is a pretty big drawback. To me, it means I wouldn't use this for a product that wasn't intended for a techie programmer audience. Not that it…",{"id":119,"by":120,"text":121},"44935568","pedrovhb","Nice! Seems very useful if you can drop in and have everything work. Nitpicking a bit: it's not as much _rendering_ markdown as it's _syntax highlighting_ it. Another interesting…",{"value":123,"source":81,"evidence":124},"Alignment breaks in some mobile browsers with bold text widths.",[125,129],{"id":126,"by":127,"text":128},"44935240","tomsmeding","In Firefox on Android, the bold font is wider than the upright and italic fonts, breaking alignment. (It works fine in Chrome on the same Android phone. Android 16, Firefox…",{"id":130,"by":131,"text":132},"44936418","lifthrasiir","In fact, depending on font-synthesis [1] and the exact choice of fonts (even when they are monospaced), the alignment can be easily off. That's why this approach only works to…",[134,145,160,168],{"value":135,"source":81,"evidence":136},"Add list auto-continuation on Enter.",[137,141],{"id":138,"by":139,"text":140},"44934484","mosselman","Very cool! So simple, I love it. One thing that would be great is a bit better support for lists (todos, unordered and ordered) where when you press enter once it will add…",{"id":142,"by":143,"text":144},"44934329","breakfastduck","I really like the simplicity of this. I have a couple projects I could see this being really useful in, at least as an option instead of pure plain text. I still feel like…",{"value":146,"source":81,"evidence":147},"Wrap as a web component.",[148,152,156],{"id":149,"by":150,"text":151},"44938099","WA","Great project! I was looking into this area too for a while. Any reasons you didn't turn this into a web component? Seems like a no-brainer if I can basically use it like…",{"id":153,"by":154,"text":155},"44938615","TeddyDD","Have you considered wrapping this in web component so it can be used without the div + constructor call ceremony?",{"id":157,"by":158,"text":159},"44938692","splitbrain","> Embedding was a nightmare - any inherited CSS from parent pages (margin, padding, line-height) would shift alignment. This seems to be the perfect use case for a web component…",{"value":161,"source":81,"evidence":162},"Support image previews.",[163,167],{"id":164,"by":165,"text":166},"44935631","walterlw","would absolutely love this for a personal note-taking project, but having image support and some sort of auto-completion for commands, lists, tags etc is crucial for something…",{"id":100,"by":101,"text":102},{"value":169,"source":81,"evidence":170},"Syntax highlighting for code blocks.",[171],{"id":172,"by":173,"text":174},"44935723","drob518","This is cool (and amazingly simple). Would be even cooler than it already is if it would syntax highlight code in code blocks, too.",[176,183,190],{"value":177,"source":81,"evidence":178},"How does it handle large documents?",[179],{"id":180,"by":181,"text":182},"44933260","nm980","Can you send the GitHub link again? And how does this handle rendering larger documents?",{"value":184,"source":81,"evidence":185},"How does it differ from marked on npm?",[186],{"id":187,"by":188,"text":189},"44935142","maz1b","Nice job. How is this different than marked on npm?",{"value":191,"source":81,"evidence":192},"Does it support tables?",[193],{"id":194,"by":195,"text":196},"44938298","grigio","what about tables?",[198,205,212,219],{"value":199,"source":81,"evidence":200},"Milkdown",[201],{"id":202,"by":203,"text":204},"44934688","Jonovono","Nice, I was playing around with Milkdown. it's pretty cool: https:\u002F\u002Fmilkdown.dev\u002Fplayground. It's like a block editor like notion for markdown so you don't need the split pane…",{"value":206,"source":81,"evidence":207},"CodeJar",[208],{"id":209,"by":210,"text":211},"44936527","zazaulola","2kb https:\u002F\u002Fmedv.io\u002Fcodejar\u002F",{"value":213,"source":81,"evidence":214},"rich-textarea",[215],{"id":216,"by":217,"text":218},"44936928","uonr","https:\u002F\u002Fgithub.com\u002Finokawa\u002Frich-textarea",{"value":220,"source":81,"evidence":221},"Pell and spell",[222,226],{"id":223,"by":224,"text":225},"44936173","phonon","912 bytes.... https:\u002F\u002Fsylvainpolletvillard.github.io\u002Fspell\u002Fdemo.html",{"id":227,"by":228,"text":229},"44937999","Imustaskforhelp","This is a really good project, kudos! What I am wondering is if I can modify the project enough so that lets say when I do # test, then it can automatically modify it to be…",{"comments":37,"answered":43,"key":231},[232],{"id":233,"text":234},"44933112","The idea is that two instances of overtype would be initialized inside those divs!",{"commenters":236,"max_depth":39,"maker_replies":37,"first_comment_mins":31,"lifespan_hours":237},88,45,[239,241,245,248,251,255,257,260,262,266,270,274,276,278,280,283,286,289,292,295,297,299,303,306,309,310,312,315,316,319,321,323,327,329,334,337,339,342,345,346,350,355,360,365,369,374,378,379,383,385,389,393,396,399,403,405,409,413,417,419,423,426,430,433,437,439,443,447,450,453,457,461,463,465,468,471,473,477,480,482,484,488,492,497,500,504,508,510,514,518,522,526,528,532,536,538,541,544,546],[119,43,17,240,120,43],"project\u002Fmixed\u002Fdesign",[242,43,43,243,244,43],"44936041","commenter\u002Fneutral\u002Fnone","jagged-chisel",[246,43,43,243,247,43],"44936146","4b11b4",[249,43,43,243,250,43],"44938134","franga2000",[252,43,17,253,254,43],"44936929","project\u002Fneutral\u002Fexecution","pspeter3",[256,43,17,253,131,43],"44938114",[258,43,17,253,259,43],"44939189","scottfr",[96,37,37,261,97,43],"project\u002Fcritical\u002Fidea",[263,46,39,264,265,43],"44935314","project\u002Fpositive\u002Fnone","dchest",[267,17,39,268,269,43],"44935315","project\u002Fpositive\u002Fidea","mmastrac",[271,17,17,272,273,43],"44937030","project\u002Fneutral\u002Fidea","rockwotj",[223,47,43,275,224,43],"other\u002Fneutral\u002Fnone",[277,47,43,275,228,43],"44937953",[279,47,17,253,150,43],"44938091",[281,39,39,264,282,43],"44936782","vmurthy",[284,39,39,268,285,43],"44937114","runako",[287,39,39,268,288,43],"44937269","dcreater",[290,39,43,275,291,43],"44937580","pavlov",[293,32,39,268,294,43],"44932986","janwilmake",[115,32,37,296,116,43],"project\u002Fcritical\u002Fdesign",[100,298,37,261,101,43],7,[300,298,17,301,302,43],"44935772","project\u002Fneutral\u002Fdesign","calmworm",[304,298,43,243,305,43],"44935866","macintux",[307,298,17,308,150,43],"44938078","project\u002Fneutral\u002Fnone",[104,298,37,261,105,43],[311,298,43,243,150,43],"44941420",[313,298,37,261,314,43],"44939825","eviks",[108,298,37,261,109,43],[317,41,39,268,318,43],"44935560","reactordev",[157,320,17,253,158,43],9,[202,322,43,275,203,43],10,[324,325,17,253,326,43],"44941065",11,"c-smile",[138,328,17,301,139,43],12,[330,331,43,332,333,43],"44936736",13,"other\u002Fneutral\u002Fidea","rendaw",[335,33,37,261,336,43],"44936078","bloppe",[338,33,43,243,131,43],"44936394",[340,33,43,275,341,43],"44940094","matthews3",[126,343,37,344,127,43],15,"project\u002Fcritical\u002Fexecution",[130,343,17,253,131,43],[347,348,37,261,349,43],"44937088",16,"nbbaier",[351,352,17,353,354,43],"44934159",17,"project\u002Fneutral\u002Fdocs","ingigauti",[356,357,17,358,359,43],"44935452",18,"project\u002Fmixed\u002Fexecution","SamInTheShell",[361,362,39,363,364,43],"44937594",19,"project\u002Fpositive\u002Fdesign","holler",[366,367,39,268,368,43],"44940723",20,"iambateman",[370,371,39,372,373,43],"44943543",21,"project\u002Fpositive\u002Fexecution","z5h",[375,376,39,268,377,43],"44938123",22,"gethly",[149,31,17,253,150,43],[380,381,39,363,382,43],"44932829",24,"aschelch",[233,381,43,384,10,37],"maker\u002Fneutral\u002Fnone",[386,387,17,272,388,43],"44935613",25,"Tmpod",[390,391,39,268,392,43],"44937408",26,"jona777than",[142,394,17,395,143,43],27,"project\u002Fmixed\u002Fidea",[397,30,39,264,398,43],"44935614","wesz",[400,401,39,268,402,43],"44938175",29,"zoom6628",[153,404,17,253,154,43],30,[406,407,17,240,408,43],"44934951",31,"philo23",[410,411,39,268,412,43],"44936011",32,"jv22222",[414,415,43,275,416,43],"44936018",33,"pyromaker",[418,415,43,275,288,43],"44938471",[420,421,17,353,422,43],"44935834",34,"indigodaddy",[424,421,43,243,425,43],"44935931","small_scombrus",[427,428,17,301,429,43],"44941571",35,"jtbayly",[180,431,17,432,181,43],36,"project\u002Fneutral\u002Fperformance",[434,435,37,344,436,43],"44941462",37,"6510",[216,438,43,275,217,43],38,[440,441,39,268,442,43],"44951256",39,"g105b",[444,445,37,344,446,43],"44935901",40,"ForceBru",[448,445,43,243,449,43],"44935952","acherion",[451,445,43,452,446,43],"44938664","commenter\u002Fneutral\u002Fdocs",[454,455,37,344,456,43],"44942048",41,"ivape",[458,459,17,301,460,43],"44935542",42,"neilv",[187,462,17,272,188,43],43,[172,464,39,264,173,43],44,[466,237,37,344,467,43],"44936748","rafram",[209,469,43,470,210,43],46,"other\u002Fneutral\u002Fperformance",[164,472,17,395,165,43],47,[474,475,43,275,476,43],"44936365",48,"bullen",[478,475,43,275,479,43],"44936496","farley13",[481,475,43,275,476,43],"44950437",[88,483,39,264,89,43],49,[485,486,37,261,487,43],"44936982",50,"ZYbCRq22HbJ2y7",[489,490,17,301,491,43],"44934550",51,"cchance",[493,494,17,495,496,43],"44936356",52,"project\u002Fmixed\u002Fdocs","jackbridger",[227,498,39,499,228,43],53,"project\u002Fpositive\u002Fperformance",[501,502,39,264,503,43],"44935147",54,"jerpint",[505,506,39,264,507,43],"44939584",55,"kaboomshebang",[84,509,39,268,85,43],56,[511,512,39,268,513,43],"44934276",57,"octobereleven",[515,516,17,353,517,43],"44937176",58,"albert_e",[519,520,39,268,521,43],"44938509",59,"victorbjorklund",[523,524,39,264,525,43],"44935361",60,"sdairs",[194,527,17,253,195,43],61,[529,530,39,363,531,43],"44934406",62,"Bengalilol",[533,530,43,534,535,43],"44935085","commenter\u002Fcritical\u002Fnone","sitkack",[537,530,43,243,460,43],"44935473",[539,530,43,243,540,43],"44935525","vid",[542,530,43,243,543,43],"44936001","3836293648",[545,530,43,243,540,43],"44937157",[547,548,39,264,549,43],"44935005",63,"knoopx",[],[552,557,562,566,571,575],{"id":553,"name":554,"points":555,"category":556},"44962066","visualrambling.space",865,"learning_science",{"id":558,"name":559,"points":560,"category":561},"44923520","ScrollGuard",690,"productivity",{"id":563,"name":564,"points":565,"category":561},"44942731","Whispering",591,{"id":567,"name":568,"points":569,"category":570},"44931824","NextDNS",537,"infrastructure",{"id":572,"name":573,"points":574,"category":570},"44915164","Edka",437,{"id":576,"name":577,"points":578,"category":579},"44942099","Mavericks Forever",402,"other",false,"v2",{"id":583,"name":5,"line":6,"ai":580,"cat":19,"year":12,"points":13,"comments":14,"rec":27,"s":584,"top":17,"kw":585,"maker":10,"domain":586,"tier":18,"attempts":43,"strip":587,"url":-1,"mix":588,"praise":80,"objection":93,"sub":20},44932651,0.23,[20,23,24,25,26],"","3033535513133311255555353251133034555505",[30,31,32,33],1794036680517]