1 line
7.5 KiB
JavaScript
1 line
7.5 KiB
JavaScript
"use strict";(self.webpackChunkdocs=self.webpackChunkdocs||[]).push([["4472"],{3612:function(e,r,s){s.r(r),s.d(r,{default:()=>h,frontMatter:()=>a,metadata:()=>t,assets:()=>c,toc:()=>d,contentTitle:()=>o});var t=JSON.parse('{"id":"features/projects","title":"Projects","description":"A LiveCodes project is a combination of markup, styles & scripts that result in a single web page. Check the section about the Result Page to have more details about how this page is constructed.","source":"@site/docs/features/projects.mdx","sourceDirName":"features","slug":"/features/projects","permalink":"/docs/features/projects","draft":false,"unlisted":false,"editUrl":"https://github.com/live-codes/livecodes/tree/develop/docs/docs/features/projects.mdx","tags":[],"version":"current","frontMatter":{},"sidebar":"docsSidebar","previous":{"title":"Features","permalink":"/docs/features/"},"next":{"title":"Templates","permalink":"/docs/features/templates"}}'),n=s("5893"),i=s("65");let a={},o="Projects",c={},d=[{value:"Markup Editor",id:"markup-editor",level:2},{value:"Style Editor",id:"style-editor",level:2},{value:"Script Editor",id:"script-editor",level:2},{value:"Organizing Projects",id:"organizing-projects",level:2},{value:"Related",id:"related",level:2}];function l(e){let r={a:"a",admonition:"admonition",em:"em",h1:"h1",h2:"h2",header:"header",img:"img",li:"li",p:"p",strong:"strong",ul:"ul",...(0,i.a)(),...e.components};return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(r.header,{children:(0,n.jsx)(r.h1,{id:"projects",children:"Projects"})}),"\n",(0,n.jsxs)(r.p,{children:["A ",(0,n.jsx)(r.em,{children:"LiveCodes"})," project is a combination of markup, styles & scripts that result in a ",(0,n.jsx)(r.strong,{children:"single web page"}),". Check the section about the ",(0,n.jsx)(r.a,{href:"/docs/features/result",children:"Result Page"})," to have more details about how this page is constructed."]}),"\n",(0,n.jsx)(r.p,{children:"There is no concept of file system or, for example, organizing multiple files in a directory structure of a single project."}),"\n",(0,n.jsx)(r.admonition,{title:"Simple Concept",type:"info",children:(0,n.jsxs)(r.p,{children:["code in ",(0,n.jsx)(r.a,{href:"#markup-editor",children:"markup editor"})," + code in ",(0,n.jsx)(r.a,{href:"#style-editor",children:"style editor"})," + code in ",(0,n.jsx)(r.a,{href:"#script-editor",children:"script editor"})," + ",(0,n.jsx)(r.a,{href:"/docs/features/external-resources",children:"external resources"})," => ",(0,n.jsx)(r.a,{href:"/docs/features/result",children:"result page"})]})}),"\n",(0,n.jsx)(r.h2,{id:"markup-editor",children:"Markup Editor"}),"\n",(0,n.jsx)(r.p,{children:"Code added in this editor eventually represents the page markup (HTML)."}),"\n",(0,n.jsx)(r.p,{children:"Examples for languages supported include HTML, Markdown, Pug, Haml."}),"\n",(0,n.jsx)(r.h2,{id:"style-editor",children:"Style Editor"}),"\n",(0,n.jsx)(r.p,{children:"Code added in this editor eventually represents the page styles (CSS)."}),"\n",(0,n.jsx)(r.p,{children:"Examples for languages supported include CSS, SCSS, SASS, Less, Stylus. In addition, many CSS processors are supported (e.g. Autoprefixer, postcss-preset-env, postcss-import-url, PurgeCSS, Tailwind CSS)."}),"\n",(0,n.jsx)(r.h2,{id:"script-editor",children:"Script Editor"}),"\n",(0,n.jsx)(r.p,{children:"Code added in this editor eventually represents the page scripts."}),"\n",(0,n.jsx)(r.p,{children:"These are either:"}),"\n",(0,n.jsxs)(r.ul,{children:["\n",(0,n.jsx)(r.li,{children:"Languages compiled to JavaScript (e.g TypeScript, JSX, CoffeeScript)"}),"\n",(0,n.jsxs)(r.li,{children:["Languages that are interpreted by a JavaScript runtime (e.g. PHP - interpreted by ",(0,n.jsx)(r.a,{href:"https://github.com/asmblah/uniter",children:"Uniter runtime"}),", Scheme - interpreted by ",(0,n.jsx)(r.a,{href:"https://www.biwascheme.org",children:"BiwaScheme"}),")"]}),"\n",(0,n.jsxs)(r.li,{children:["Languages running in WASM (e.g. Python - ",(0,n.jsx)(r.a,{href:"https://pyodide.org/",children:"Pyodide"}),", AssemblyScript)."]}),"\n"]}),"\n",(0,n.jsxs)(r.p,{children:["For the full list of supported languages, check the ",(0,n.jsx)(r.a,{href:"/docs/languages/",children:"Languages section"}),"."]}),"\n",(0,n.jsx)(r.h2,{id:"organizing-projects",children:"Organizing Projects"}),"\n",(0,n.jsxs)(r.p,{children:["Projects can be saved to the local device browser storage from Project menu \u2192 Save / Project menu \u2192 Save as \u2192 Fork (New Project) or using the keyboard shortcut ",(0,n.jsx)("kbd",{children:"Ctrl"})," + ",(0,n.jsx)("kbd",{children:"S"}),"."]}),"\n",(0,n.jsx)(r.p,{children:"The list of saved projects can be accessed from Project menu \u2192 Open."}),"\n",(0,n.jsxs)(r.p,{children:[(0,n.jsx)(r.img,{alt:"LiveCodes Projects",src:s(7077).Z+"",width:"2240",height:"1400"}),"."]}),"\n",(0,n.jsx)(r.p,{children:"Saved projects can be sorted by title or date (asc/desc). They can also be filtered by language and/or tags. You may, as well, search for a project by title or description."}),"\n",(0,n.jsx)(r.p,{children:"Project title, description and tags can be edited from Project menu \u2192 Project Info."}),"\n",(0,n.jsxs)(r.p,{children:["Projects can be ",(0,n.jsx)(r.a,{href:"/docs/features/import",children:"imported"}),", ",(0,n.jsx)(r.a,{href:"/docs/features/export",children:"exported"}),", ",(0,n.jsx)(r.a,{href:"/docs/features/sync",children:"synchronized"}),", ",(0,n.jsx)(r.a,{href:"/docs/features/backup-restore",children:"backed up and restored"}),"."]}),"\n",(0,n.jsxs)(r.p,{children:[(0,n.jsx)(r.a,{href:"/docs/features/assets",children:"Assets"})," and ",(0,n.jsx)(r.a,{href:"/docs/features/snippets",children:"code snippets"})," are stored in the browser storage and can be used across projects."]}),"\n",(0,n.jsx)(r.h2,{id:"related",children:"Related"}),"\n",(0,n.jsxs)(r.ul,{children:["\n",(0,n.jsx)(r.li,{children:(0,n.jsx)(r.a,{href:"/docs/features/result",children:"Result Page"})}),"\n",(0,n.jsx)(r.li,{children:(0,n.jsx)(r.a,{href:"/docs/features/templates",children:"Templates"})}),"\n",(0,n.jsx)(r.li,{children:(0,n.jsx)(r.a,{href:"/docs/features/snippets",children:"Code Snippets"})}),"\n",(0,n.jsx)(r.li,{children:(0,n.jsx)(r.a,{href:"/docs/features/assets",children:"Assets"})}),"\n",(0,n.jsx)(r.li,{children:(0,n.jsx)(r.a,{href:"/docs/features/external-resources",children:"External Resources"})}),"\n",(0,n.jsx)(r.li,{children:(0,n.jsx)(r.a,{href:"/docs/features/import",children:"Import"})}),"\n",(0,n.jsx)(r.li,{children:(0,n.jsx)(r.a,{href:"/docs/features/export",children:"Export"})}),"\n",(0,n.jsx)(r.li,{children:(0,n.jsx)(r.a,{href:"/docs/features/backup-restore",children:"Backup/Restore"})}),"\n",(0,n.jsx)(r.li,{children:(0,n.jsx)(r.a,{href:"/docs/features/sync",children:"Sync"})}),"\n",(0,n.jsx)(r.li,{children:(0,n.jsx)(r.a,{href:"/docs/features/share",children:"Share"})}),"\n",(0,n.jsx)(r.li,{children:(0,n.jsx)(r.a,{href:"/docs/features/broadcast",children:"Broadcast"})}),"\n"]})]})}function h(e={}){let{wrapper:r}={...(0,i.a)(),...e.components};return r?(0,n.jsx)(r,{...e,children:(0,n.jsx)(l,{...e})}):l(e)}},7077:function(e,r,s){s.d(r,{Z:function(){return t}});let t=s.p+"assets/images/saved-projects-1-31010fb8ad45e76e319ab98bc16f6812.jpg"},65:function(e,r,s){s.d(r,{Z:function(){return o},a:function(){return a}});var t=s(7294);let n={},i=t.createContext(n);function a(e){let r=t.useContext(i);return t.useMemo(function(){return"function"==typeof e?e(r):{...r,...e}},[r,e])}function o(e){let r;return r=e.disableParentContext?"function"==typeof e.components?e.components(n):e.components||n:a(e.components),t.createElement(i.Provider,{value:r},e.children)}}}]); |