Ett prototypverktyg med öppen källkod för att hjälpa ingenjörer på alla nivåer att bygga deras nästa React-webbapplikation
Aktuell miljö
I dagens mjukvaruutvecklingslandskap kommer du att få svårt att hitta ett mer populärt JavaScript-ramverk än React. Med fler och fler utvecklare och företag som arbetar med detta kraftfulla verktyg varje dag, växer behovet av mer tillgänglighet. Nu kan du bara starta en ny React-applikation med Create React-appen, det är otroligt enkelt. Din ansökan skulle dock komma med MASSOR av extra bloatware som du oftast helt enkelt inte behöver. Boilerplate-koden kastar ett brett nät för att rymma alla appar, istället för att specialisera sig på den individuella appens behov och stoppar in dem djupt in i dess kapslade filstruktur. Detta var en flaskhals som fflow-teamet kände att vi både kunde förbättra och effektivisera. Majoriteten av utvecklarna använder Create React App eftersom den är så snabb och enkel att använda. Om du kan behålla effektiviteten i att starta en grundläggande React-applikation från början och ta bort alla överflödiga, irrelevanta filer, kommer du fram till vår produkt.
Vi introducerar fflow
Genom ett samarbete med teknikacceleratorn OS Labs har teamet på fflow utvecklat ett verktyg för ingenjörer som erbjuder flexibiliteten att bygga din egen applikation från grunden, samtidigt som du får samma tidsbesparande komfort som något som Create-React-App. Vi är oerhört glada över att tillkännage alfa-lanseringen av vårt utvecklarverktyg — fflow — ett vackert och lättanvänt prototypverktyg med öppen källkod för att hjälpa ingenjörer på alla nivåer att bygga deras nästa React (och snart TypeScript) webbapplikation.
Hur fungerar det?
fflow utnyttjar Atlassians React-Beautiful-DnD för att tillåta utvecklare att kartlägga och visualisera layouten för sin kodbas, oavsett om det är anpassade React-komponenter eller enkla HTML-element. När du drar HTML-taggar till arbetsytan och omordnar eller tar bort element, uppdateras den välbekanta kodredigeraren som är uppstartad av Monaco Editor för att ge dig en tydlig bild av varje React-komponent och dess underordnade, formaterade för jsx.
GIPH:Dra element till duken
När din app växer växer fflows filkatalog för din app, vilket ger dig en tydlig karta över hur din app kommer att organiseras. Om du vill skrota allt arbete du har gjort kan du rensa enskilda komponenter eller börja helt från början genom att rensa hela projektet.
När du är nöjd med grunden för din applikation kan du exportera projektet till din lokala miljö, allt snyggt samlat och redo att köra.
Inkluderat i det paketet är alla filer som behövs för att fortsätta utvecklas i din föredragna IDE. Du hittar nedladdade alla anpassade React-komponenter som du skapade, en CSS-stilmall med baslinje-CSS-stilar samt alla andra stilar som du inkluderade i CSS-redigeraren, en index.html-fil och en webbpaketkonfiguration, konfigurerad för enkel åtkomst.
GIPH:Lägga till stilar i CSS-redigeraren
Ditt projekt kan sedan snurras upp antingen genom att navigera till ditt projekts katalog med din egen terminal eller genom att använda det som fflow tillhandahåller för dig, vilket omedelbart tillåter en att fortsätta skapa sin applikation.
GIPH:Exportprojekt och inbyggd terminal
Och med det ger fflow utvecklare en sömlös och snabb process för att skapa helt anpassade React-webbapplikationer, samtidigt som de sparar värdefull tid och legwork i processen. Prova det idag, ditt arbetsflöde kommer att tacka dig.
Ladda ner fflow
Du kan ladda ner alfaversionen av fflow för Mac eller Windows på vår webbplats och besöka vår GitHub-repo för att stödja oss genom att stjärnmärka vår repo och bidra till funktionerna på färdplanen.
Det här är en produkt med öppen källkod och vi välkomnar alla bidrag från andra utvecklare – ett verktyg från utvecklare, för utvecklare, är det bästa sättet att bygga något användbart. Ta kontakt med oss och hjälp till att ta fflow till nästa nivå.
Anslut till fflow-teamet
Regn Hsu LinkedIn | GitHub
Bryanna DeJesus LinkedIn | GitHub
Ronak Hirpara LinkedIn | GitHub
Jake Pino LinkedIn | GitHub