Intrdoção:

Recentemente eu criei um projeto totalmente novo, um projetodo do qual eu nunca tinha sequer tocado de nenhuma forma. O projeto é um site onde você pode criar notas no formato .md. Este projeto foi feito inteiramente pensando na simplicidade como foco principal.

você pode encontrar o projeto aqui: Anotações e tenho dois posts falando sobre como funciona a ferramenta: [ Pitch ] Site de anotações simples no formato Markdown, [ update ] Site de anotações simples no formato Markdown (melhorias)

Além disso, vou desenvolvido somente com HTML, CSS, Javascript/typescript e algumas outras ferramentas simples como prettier, que auxilia na formatação no código.

Irei comentar um pouco sobre a experiência que é criar algo totalmente novo e sair do conforto.

Sem framework, sem bibliotecas, apenas o código puro:

A primeira experiência interessante é de ter criado relativamente complexo sem nenhum auxilio das maravilhosas ferramentas: React, Next.js, Tailwindcss, Next.ui, dentre outras como webpack e babel. Que são ferramentas muito boas, mas a maioria das coisas são pré-configuradas por baixo dos panos como: webpack e babel que eu sei para que serve, mas nunca configurei do zero. Ainda pretendo implementar neste projeto inclusive.

Criar algo puro, do zero, é bem interessante, para falar a verdade. Não foi tedioso, foi incrível em saber que o JavaScript possui coisas das quais eu nunca fazia ideia!

Essa experiência de fez reflitir que Frameworks são bons, e que ajudam em vários processos e na agilidade. Entretanto, volta e meia é recomendado criar algo puro, do zero sem biblioteca e nem nada, pois somente assim sua base é fortalecidade de fato...

Entendo melhor como funciona trabalhar com String:

Obviamente, manipulação de strings simples, eu sei fazer. Alias, acredito que todos saibam... Mas em um projeto que trabalha inteiramente ao redor de texto(string) como um site de anotações, é diferente, muito diferente e interessante!

A primeira coisa que eu notei é que: aqueles métodos que parecem ser inúteis ou pouco usados na verdade são bem úteis no projeto certo! Eu tinha utilizado de fato o método replace, e olha, eu utilizei muito e realmente é um método muito úteil, assim como split e o slice, assim como vários outros como o includes. Esses métodos, dos quais nunca/pouco utilizei em projetos como Landing pages e To-do Lists.

Além disso, trabalhar com strigs é realmente complicado, por uma série de fatores. Uma das dificuldades foi em manipular precisamente partes do texto corretamente... e isso já puxa o gancho para o próximo tópico.

A quantidade de aprendizado é enorme:

Como eu disse anteriormente, eu nunca fiz algo assim, portanto, existiam várias coisas das quais eu nunca saberia, a menos que eu trabalhasse em algo assim.

Uma das coisas que eu aprendi, para manipular corretamente strings, foi a existência do selection object, onde o selection object, representa uma parte do texto (texto selecionado) ou tendo um comportamente diferente para nodes.

selection possui alguns métodos interessantes que me permitem trabalhar com nodes de textos específicos, inclusive, esteve também foi um aprendizado! Eu pensava que o texto dentro do input era trata como um todo, mas na verdade, cada palavra é um node de text, onde com a ajuda do selection e range object, podemos manipular precisamente essas pequenas partes do texto.

Ainda estou estudando profundamente esses assuntos, apenas estudei sob demanda durante o projeto, mas pretendo me aprofundar neles nos próximos dias.

Typescript me ajudou também:

Além de aprender várias coisas mencionadas acima, o typescript me ajudou a entender melhor certas coisas.

Não é de hoje que o Typescript reclama até demais... mas isso me ajudou muito, pois eu descobri que existem checagens específicas a nível de node, como o TEXT_NODE para certificar-se de que o node em questão é do tipo text.

TypeScript também me ajudou a typar melhor várias coisas, como eventos, que são bem chatinhos no cameço, mas depois que pega o jeito, dá certo.

Nem sempre é como pensamos:

Programar não é fácil, e na maior parte das vezes, criar algo não é exatamente como está na nossa cabeça... Muita coisa do qual pensei que seria a forma, não foi, na verdade, gerou comportamentos bem peculiares. Nesses casos eu utilizei auxilio de IA, para me ajudar a entender o problema, depois eu estudei o código e anotei para no futuro, eu já ficar esperto.

Esse processo se repetiu bastante, sempre tendo como foco em aprender aquilo que a IA me dava, e entender para aplicar no futuro.

Vários resultado foram errôneos. É estranho, pois eu não sabia o motivo do código original não estar funcionando, mas sabia que a solução entregue também não iria resolver... testei todos os código que eu achei que não iria, e confirmei, nenhum funcionou.

O aprendizado disso é que IA é uma ferramente que te auxilia bastante naquilo que você não entende, ou não sabe sequer que existe. Entretanto, deve-se sempre buscar entender o que lhe foi entregue, e aprender!

Uso com cautela devidos a erros também é importante.

Conclusão:

Houve muito aprendizado, muita dor de cabeça, mas deu certo. O projeto está funcionando, embora tenha algumas melhorias e correções de bugs a serem feitas. Para os que chegaram até aqui, agradeço pelo o tempo dedicado a esta leitura!