JSONsite：使用JSON文件创建SPA页面

我做了一个东西，可以让你用一个JSON文件创建一个网站。

做一个fork，添加你的URL，然后咣当一声，一个好看的网站就用JSON文件做出来了。而且所有的网站都是由Vercel托管的，他们有惊人的正常运行时间和CDN。

听起来不错，但是如何运作?

JSONsite将从提供的URL中获取JSON文件
然后，JSONsite将开始解析这些数据，并将其传递给nunjucks。
从nunjucks输出的HTML将被最小化
您的网站将在您选择的Slug时准备好!

所以基本上这样：

{

"title":"我的网站",

"description":"TheamazingwebsiteofJohnDoe",

"image":"https://cdn.glitch.com/1788ed8a-5cc6-45e9-a3b6-18d6457af699%2Fundraw_profile_pic_ic5t.png?v=1606325421049",

"author":"ZhangZhang",

"theme":{

"navbar_color":"dark",

"jumbotron_color":"light",

"footer_color":"light"

},

"pages":[

{

"title":"主页",

"id":"main",

"content":"Loremipsumdolorsitamet,consecteturadipiscingelit,seddoeiusmodtemporincididuntutlaboreetdoloremagnaaliqua.Auctorurnanuncidcursus.Maecenasultriciesmiegetmaurispharetraetultrices.Nuncconsequatinterdumvariussit.Suspendissesednisilacussed.Temporideunislnuncmiipsumfaucibusvitae.Urnanectinciduntpraesentsemperfeugiatnibhsedpulvinar.Euismodquisviverranibhcraspulvinarmattisnuncsedblandit.Sitametconsecteturadipiscingelitutaliquampurussitamet.Plateadictumstquisquesagittispurussitametvolutpatconsequat.Interdumvelitlaoreetiddonecultricestinciduntarcunon.Etnetusetmalesuadafames.Ipsumfaucibusvitaealiquetnecullamcorpersit.Ultriciesmiegetmaurispharetraet.Etiamtempororcieulobortiselementumnibhtellusmolestie.Dolorsitametconsecteturadipiscing.Sedtempusurnaetpharetrapharetramassamassaultriciesmi.Actinciduntvitaesemperquislectusnullaat.Odioutsemnullapharetradiamsitamet.Viverraadipiscingatintellus."

},

{

"title":"关于",

"id":"about",

"content":"Loremipsumdolorsitamet,consecteturadipiscingelit,seddoeiusmodtemporincididuntutlaboreetdoloremagnaaliqua.Luctusaccumsantortorposuereacutconsequatsemperviverra.Pharetramagnaacplaceratvestibulumlectusmauris.Scelerisqueindictumnonconsecteturaeratnamatlectus.Velpharetravelturpisnuncegetloremdolorsedviverra.Duisultricieslacussedturpistinciduntidaliquetrisusfeugiat.Gravidainfermentumetsollicitudin.Quamvulputatedignissimsuspendisseinestanteinnibhmauris.Sitametmauriscommodoquis.Bibendumenimfacilisisgravidanequeconvallisa.Quisimperdietmassatinciduntnuncpulvinar.Leoadiamsollicitudintemporid.Sitametfacilisismagnaetiam.Pharetrasitametaliquamiddiammaecenasultricies.Nullaatvolutpatdiamutvenenatistellus.Egetloremdolorsedviverraipsumnunc.Lobortisscelerisquefermentumduifaucibusin.Ametcursussitametdictumsitametjustodonecenim.Posuereurnanectinciduntpraesentsemperfeugiat."

},

{

"title":"联系",

"id":"contact",

"content":"Loremipsumdolorsitamet,consecteturadipiscingelit,seddoeiusmodtemporincididuntutlaboreetdoloremagnaaliqua.Augueutlectusarcubibendumatvarius.Hachabitasseplateadictumstvestibulumrhoncusest.Tinciduntvitaesemperquislectusnullaatvolutpatdiam.Eunondiamphasellusvestibulumloremsedrisusultricies.Posuereloremipsumdolorsitametconsectetur.Maurissitametmassavitaetortor.Malesuadafamesacturpisegestasmaecenaspharetraconvallisposuere.Diamvolutpatcommodosedegestasegestas.Orcisagittiseuvolutpatodiofacilisis.Duiutornarelectussitamet.Nislvelpretiumlectusquamidleoinvitaeturpis.Pharetraetultricesnequeornareaeneaneuismodelementumnisiquis.Arcunonsodalesnequesodalesutetiamsitamet.Scelerisquepurussemperegetduisat.Acturpisegestassedtempusurnaetpharetra.Plateadictumstquisquesagittispurus."

}

],

"footer":"©2020JohnDoe.AllRightsReserved.",

"javascript":"console.log('Ooohlook,customJavaScript!')",

"css":"/*YoucanputcustomCSShere!*/"

}