Witam.
Proszę Państwa, mamy to!
Dowiezione! xD
Zgłaszam się pokornie po ocenę mojego edytora.
http://infinityhost.ct8.pl/Edytor/
(tam jest pełna galeria)
Tutaj stylizuję dokument wywoływany przez php nagranie 12
0
2
Bardzo fajny edytor, chciałbym go użyć do mojego następnego projektu, tylko mam kilka pytań:
- Jak w tym edytorze zbudować gotową apkę do wynikowego pliku w wersji produkcyjnej, którą można wrzucić na produkcję?
- Jak w tym edytorze wpisać kod wspierający różne przeglądarki (np prefixy
-webkit-,-moz, etc.)? - Korzystając z tego edytora chciałbym wpisać property z klawiatury, a nie wybrać ich myszką z dropdowna. Powinno być autocomplete przy atrybutach.
- Czemu nie użyłeś ikonek, tylko zamiast tego znaki ascii? (np.
<,>, zamiast użyć ikonek svg dostępnych za darmo? albo narysować swoje, alby użyć FontAwesome albo Icomon?) - Czemu w edytorze są czcionki szeryfowe? To wygląda bardzo źle, powinny być sans-serif.
- Dlaczego połowa przycisków jest po polsku, a połowa po angielsku?
- Dlaczego nie ma inspektora obiektów do debugowania mojej strony?
- Dlaczego najważniejsze opcje takie jak "Góra", "Prawo", "Dół", "Lewo" nie mają skrótów klawiszowych? Każdy porządny edytor powinien mieć skróty klawiszowe do najważniejszych opcji
- Chciałbym żeby był kolor picker, z którego można wybrać RGB koloru, a najlepiej też HSL.
- Jak w tym edytorze zrobić kilka podstron, i w ramach tych podstron współdzielić kod, np wspólny header i stopkę?
- Czemu nie ma wsparcia dla CSS3 (animation, transition, keyframes, etc.)
- Jak w tym edytorze dbać o podstawowe funkcjonalności aplikacji, czyli:
- accessibility (tagi
aria-) - seo (breadcrumby, schema, linki kanoniczne)
- dark mode
- accessibility (tagi
- W jaki sposób napisać plugin do tego edytora? Każdy porządny edytor umożliwia pisanie pluginów.
- Jak w tym edytorze pisać kod w JavaScript ES6 lub TypeScript?
0
Riddle napisał(a):
- Czemu w edytorze są czcionki szeryfowe? To wygląda bardzo źle, powinny być sans-serif.
To jest bardzo kontrowersyjna opinia. W szczególności, sam się z nią bardzo mocno nie zgadzam — szeryfowe fonty są, przy małych rozmiarach, w udokumentowany sposób bardziej czytelne: [1], [2].
0
Drogi Riddle.
- Jeśli chodzi o kod wynikowy potrzebujesz nadać elementowi HTML atrybut "id" - potem możesz go zawsze znaleźć, klikasz "Html" i Ci wyświetli kod html strony (wśród nagrań jest chyba np. na YT nagranie 3 - "migracja kodu")
-
- czy chodzi o to? (atrybut tworzy to okienko poniżej)
- czy chodzi o to? (atrybut tworzy to okienko poniżej)
- To chyba bez znaczenia, ja podczas pracy dwa razy zwróciłem uwagę na to, klikasz - działa i tyle. Nie lubię mieszać kodu z grafikami. Ale jak zechcesz specjalnie dla Ciebie dodam te svg, to żaden problem.
- Tak czcionkę też mogę dopasować.
- Testowałem to x projektach, na zwykłym pliku i na localhost (żeby sprawdzić czy prawidłowo obsłuży php - czyli i sql), na początku wszystkie były po angielsku, i wersja zagraniczna też będzie miała angielskie teksty. Jak najszybciej postaram się to poprawić.
- inspektor obiektów? jak dodasz atrybut id to każdy element z nim jest dostępny pod przyciskiem.
- Co do klawiszy skrótów - aplikacja przeznaczona do miliona projektów może wchodzić w reakcję z zawartością tworzonej treści ale też mogę to dodać ale na życzenie.
- Postaram się wkrótce dodać.
"Jak w tym edytorze zrobić kilka podstron, i w ramach tych podstron współdzielić kod, np wspólny header i stopkę?"
Czy chodzi o ramki? Do ramki najlepiej dodać taki sam kod za pomocą addExt() i wtedy pod myszą masz okienko obsługujące. Jeśli chodzi o inne strony - to do nich dodajesz tak samo kod - wtedy automatycznie operujesz na dokumencie. Jak chcesz dzielić kod to używasz atrybutu src. Nie do końca rozumiem pytanie.
"Jak w tym edytorze dbać o podstawowe funkcjonalności aplikacji, czyli"
Całość jest oparta o JS. Tam nie ma rzeczy niemożliwych. Wersja 2.0 będzie obsługiwać php(taki mam plan).
Pluginy.
Nad tym będę potrzebował się chwilę zastanowić.
Jedna rzecz - property nie jest atrybut. Ale super, że na to zwróciłeś uwagę. Idzie to zrobić. Ale na pewno nie na window.
0
Althorion napisał(a):
Riddle napisał(a):
- Czemu w edytorze są czcionki szeryfowe? To wygląda bardzo źle, powinny być sans-serif.
To jest bardzo kontrowersyjna opinia. W szczególności, sam się z nią bardzo mocno nie zgadzam — szeryfowe fonty są, przy małych rozmiarach, w udokumentowany sposób bardziej czytelne: [1], [2].
Zgoda.
To powinna być opcja zmiany.
@johnny_Be_good: Napisałeś 8 odpowiedzi, na moich 14 pytań?
0
@Riddle:
O to chodzi?
0
- Jak w tym edytorze zbudować gotową apkę do wynikowego pliku w wersji produkcyjnej, którą można wrzucić na produkcję?
W wersji gdzie okno edytora ładujesz w atrybucie "onload" elementu "body" a wywołujesz "onclick" elementem "html" (to jest jedna z miliona możliwości)
Na dokumencie na którym operujesz klikasz "body" potem znajdujesz "onload" i usuwasz lub modyfikujesz, potem to samo z "html" i "onclick"
Pozostaje kod który zapisujesz w pliku.
- Jak w tym edytorze wpisać kod wspierający różne przeglądarki (np prefixy -webkit-, -moz, etc.)?
Jak wyżej?
- Korzystając z tego edytora chciałbym wpisać property z klawiatury, a nie wybrać ich myszką z dropdowna. Powinno być autocomplete przy atrybutach.
Autocomplete przy atrybutach jest, bez problemu jestem w stanie dostarczyć wersję z umiejscowieniem takich atrybutów jakie są najwygodniejsze, żeby wszystko szło szybko i sprawnie.
- Czemu nie użyłeś ikonek, tylko zamiast tego znaki ascii? (np. <, >, zamiast użyć ikonek svg dostępnych za darmo? albo narysować swoje, alby użyć FontAwesome albo Icomon?)
Ponieważ podczas pracy tak na prawdę na to się nie zwraca uwagi.
- Czemu w edytorze są czcionki szeryfowe? To wygląda bardzo źle, powinny być sans-serif.
Czcionkę też mogę dopasować (i zapewne będzie opcja wyboru wkrótce)
- Dlaczego połowa przycisków jest po polsku, a połowa po angielsku?
Poprawione. Wersja najnowsza to jest ta z pustym polem po prawej stronie.
- Dlaczego nie ma inspektora obiektów do debugowania mojej strony?
Jeśli chodzi o obiekty HTML każdy możesz przeglądać klikając na pole select po lewej stronie. Jak chcesz ukryć nadmiarowe to klikasz pole "Html" na elemencie nadrzędnym i dodajesz np. "s" do nazwy atrybutu, szybko masz ukryty go. W zależności od potrzeb możesz go pokazać. To jest opcja.
- Dlaczego najważniejsze opcje takie jak "Góra", "Prawo", "Dół", "Lewo" nie mają skrótów klawiszowych? Każdy porządny edytor
powinien mieć skróty klawiszowe do najważniejszych opcji
Zrobi się.
- Chciałbym żeby był kolor picker, z którego można wybrać RGB koloru, a najlepiej też HSL.
Zrobi się w swoim czasie.
- Jak w tym edytorze zrobić kilka podstron, i w ramach tych podstron współdzielić kod, np wspólny header i stopkę?
Ogolnie to najwygodniej, żeby każdy dokument ładował swoje okno edycji odzielnie. Czy chodzi o ramki? Zagnieździłem 3 na jednym nagraniu. Funkcja ExtWindowSrcLoadFrame(ramka) powinna ładować automatycznie okno edycji do tej ramki.
- Czemu nie ma wsparcia dla CSS3 (animation, transition, keyframes, etc.)
Czemu nie ma pewnych wartości w polu select? Narzędzie ma być szybkie, przewijanie szybkie nie jest. Bez problemowo można to dodać. Przyszła wersja będzie miała "modyfikator projektu" dopasowujący te "option"
- Jak w tym edytorze dbać o podstawowe funkcjonalności aplikacji, czyli:
accessibility (tagi aria-)
seo (breadcrumby, schema, linki kanoniczne)
dark mode
Za pomocą ... funkcji? O tak?
Postaram się nagrać na YT nagranie obrazujące tworzenie czegoś takiego, bo w sumie przydatna rzecz.
Chociaż, nie byłoby źle gdyby następowała modyfikacja arkusza CSS a nie obiektu html(atrybutu). Przemyślę i to zrobię.
- W jaki sposób napisać plugin do tego edytora? Każdy porządny edytor umożliwia pisanie pluginów.
Jak w tym edytorze pisać kod w JavaScript ES6 lub TypeScript?
Poczytam co to jest ten typescript i wtedy odpowiem, nie mniej przy włączonym JS to raczej obsłuży wszystko.
0
johnny_Be_good napisał(a):
- Jak w tym edytorze zbudować gotową apkę do wynikowego pliku w wersji produkcyjnej, którą można wrzucić na produkcję?
W wersji gdzie okno edytora ładujesz w atrybucie "onload" elementu "body" a wywołujesz "onclick" elementem "html" (to jest jedna z miliona możliwości)
Na dokumencie na którym operujesz klikasz "body" potem znajdujesz "onload" i usuwasz lub modyfikujesz, potem to samo z "html" i "onclick"
Pozostaje kod który zapisujesz w pliku.
Potrzebuje to zautomatyzować, i uruchomić budowanie tego w chmurze - np Github Actions albo Jenkins.
Aplikacja ma się wdrożyć na produkcję, bez żadnego udziału człowieka. Czy da się to zrobić w Twoim edytorze?
- Jak w tym edytorze zrobić kilka podstron, i w ramach tych podstron współdzielić kod, np wspólny header i stopkę?
Ogolnie to najwygodniej, żeby każdy dokument ładował swoje okno edycji odzielnie. Czy chodzi o ramki? Zagnieździłem 3 na jednym nagraniu. Funkcja ExtWindowSrcLoadFrame(ramka) powinna ładować automatycznie okno edycji do tej ramki.
Nie, nie, nie żadne <iframe/>! Nikt tak nie pisze aplikacji od 20 lat. Ja chce normalne, zwykłe podstrony. Że ktoś przechodzi na url /user i widzi stronę usera, wchodzi na /settings, i widzi ustawienia. I te podstrony mają mieć wspólne elementy, np nagłówek i stopkę.
- Czemu nie ma wsparcia dla CSS3 (animation, transition, keyframes, etc.)
Czemu nie ma pewnych wartości w polu select? Narzędzie ma być szybkie, przewijanie szybkie nie jest. Bez problemowo można to dodać. Przyszła wersja będzie miała "modyfikator projektu" dopasowujący te "option"
I dlatego w Twoim narzędziu nie mogę dodać animacji, transition i keyframes? To bardzo słabe że tego nie ma.
- W jaki sposób napisać plugin do tego edytora? Każdy porządny edytor umożliwia pisanie pluginów.
Jak w tym edytorze pisać kod w JavaScript ES6 lub TypeScript?Poczytam co to jest ten typescript i wtedy odpowiem, nie mniej przy włączonym JS to raczej obsłuży wszystko.
Dzisiejsze aplikacje webowe MUSZĄ, ale to absulutnie MUSZĄ wspierać zarówno TypeScript, jak i JSX, jak i inne transpilowane bajery, także jeśli Twój edytor tego nie ma, to jest bardzo złe że tego nie ma.
Przyszło mi do głowy kilka innych rzeczy:
- jak zintegrować kontrolę wersji, np
gitz tym edytrem? Jak współdzielić pracę pomiędzy kilkoma osobami w zespole? - jak w nim napisać testy automatyczne?
- jak dodać w tej aplikacji dodatkowe biblioteki z npm? W "innych edytorach" mogę normalnie zrobić np
npm install react, albonpm install vue, albonpm install @angular. Jak to zrobić tutaj? Bo nie wszystkie biblioteki da się dodać przez<script src="", niektóre są tylko do zbundlowania. - Czy ten edytor ma darkmode i lightmode?