[{"data":1,"prerenderedAt":268},["ShallowReactive",2],{"navigation":3,"\u002Fworks\u002Ffolio-magazine":46},[4],{"title":5,"path":6,"stem":7,"children":8,"page":45},"Works","\u002Fworks","works",[9,13,17,21,25,29,33,37,41],{"title":10,"path":11,"stem":12},"Currencia","\u002Fworks\u002Fcurrencia","works\u002Fcurrencia",{"title":14,"path":15,"stem":16},"Folio Magazine","\u002Fworks\u002Ffolio-magazine","works\u002Ffolio-magazine",{"title":18,"path":19,"stem":20},"Helpr","\u002Fworks\u002Fhelpr","works\u002Fhelpr",{"title":22,"path":23,"stem":24},"IV Patisserie","\u002Fworks\u002Fiv-patisserie","works\u002Fiv-patisserie",{"title":26,"path":27,"stem":28},"Mockline","\u002Fworks\u002Fmockline","works\u002Fmockline",{"title":30,"path":31,"stem":32},"Portfolio","\u002Fworks\u002Fportfolio","works\u002Fportfolio",{"title":34,"path":35,"stem":36},"Raftou - Mobile Game","\u002Fworks\u002Fraftou","works\u002Fraftou",{"title":38,"path":39,"stem":40},"Raycast x Bambulab","\u002Fworks\u002Fraycast-bambulab","works\u002Fraycast-bambulab",{"title":42,"path":43,"stem":44},"Combat Robot","\u002Fworks\u002Frobot","works\u002Frobot",false,{"id":47,"title":14,"authors":48,"body":55,"contextPreview":248,"date":249,"description":250,"extension":251,"image":252,"meta":253,"minRead":254,"navigation":255,"path":15,"roles":256,"seo":259,"stem":16,"teamName":260,"technologies":261,"url":265,"year":266,"__hash__":267},"works\u002Fworks\u002Ffolio-magazine.md",[49],{"name":50,"to":51,"target":52,"avatar":53},"Johann Cavallucci","https:\u002F\u002Fx.com\u002FJohannCVL","_blank",{"src":54,"alt":50},"https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F72015679?v=4",{"type":56,"value":57,"toc":240},"minimark",[58,63,68,92,95,99,169,171,175,193,195,199,213,215],[59,60,62],"h1",{"id":61},"a-creative-portfolio-experience","A Creative Portfolio Experience",[64,65,67],"h2",{"id":66},"overview","Overview",[69,70,71,72,76,77,80,81,84,85,87,88,91],"p",{},"This personal portfolio project aims to showcase my work in a ",[73,74,75],"strong",{},"creative and intuitive way",", inspired by modern magazines.",[78,79],"br",{},"\nI wanted to make it ",[73,82,83],{},"open source",", allowing others to get inspired or use it as a base for their own portfolios.",[78,86],{},"\nEach “magazine page” is an individual PNG image, which means even users with ",[73,89,90],{},"limited technical skills"," can add their own pages and use it as their personal portfolio.",[93,94],"hr",{},[64,96,98],{"id":97},"technologies-used","Technologies Used",[100,101,102,115],"table",{},[103,104,105],"thead",{},[106,107,108,112],"tr",{},[109,110,111],"th",{},"Technology",[109,113,114],{},"Role",[116,117,118,129,139,149,159],"tbody",{},[106,119,120,126],{},[121,122,123],"td",{},[73,124,125],{},"Nuxt.js",[121,127,128],{},"Front-end framework for fast and reactive rendering",[106,130,131,136],{},[121,132,133],{},[73,134,135],{},"Tailwind CSS",[121,137,138],{},"Styling and responsive design",[106,140,141,146],{},[121,142,143],{},[73,144,145],{},"Figma",[121,147,148],{},"UI\u002FUX design and mockup creation",[106,150,151,156],{},[121,152,153],{},[73,154,155],{},"Vercel",[121,157,158],{},"Full website hosting and deployment",[106,160,161,166],{},[121,162,163],{},[73,164,165],{},"Resend",[121,167,168],{},"Contact email management",[93,170],{},[64,172,174],{"id":173},"challenges","Challenges",[176,177,178,186],"ul",{},[179,180,181,182,185],"li",{},"Designing an interface that ",[73,183,184],{},"resembles a magazine"," while remaining functional and easy to navigate.",[179,187,188,189,192],{},"Ensuring a ",[73,190,191],{},"responsive design"," that keeps the magazine look consistent across all devices.",[93,194],{},[64,196,198],{"id":197},"conclusion","Conclusion",[69,200,201,202,205,206,208,209,212],{},"This project allowed me to practice ",[73,203,204],{},"web development and design skills",", while creating a portfolio based on an idea I had and successfully realized.",[78,207],{},"\nGoing from concept to finished product is always rewarding, and I hope this project inspires other developers to explore ",[73,210,211],{},"creative approaches"," for their own portfolios.",[93,214],{},[216,217,223,224,223,236],"a",{"href":218,"target":52,"className":219},"https:\u002F\u002Fgithub.com\u002Fcavalluccijohann\u002FPortfolio-Magazine",[220,221,222],"flex","items-center","space-x-2","\n  ",[225,226,231,232,223],"svg",{"width":227,"height":227,"viewBox":228,"fill":229,"xmlns":230},"24","0 0 24 24","currentColor","http:\u002F\u002Fwww.w3.org\u002F2000\u002Fsvg","\n    ",[233,234],"path",{"d":235},"M12 2A10 10 0 0 0 2 12c0 4.42 2.87 8.17 6.84 9.5c.5.08.66-.23.66-.5v-1.69c-2.77.6-3.36-1.34-3.36-1.34c-.46-1.16-1.11-1.47-1.11-1.47c-.91-.62.07-.6.07-.6c1 .07 1.53 1.03 1.53 1.03c.87 1.52 2.34 1.07 2.91.83c.09-.65.35-1.09.63-1.34c-2.22-.25-4.55-1.11-4.55-4.92c0-1.11.38-2 1.03-2.71c-.1-.25-.45-1.29.1-2.64c0 0 .84-.27 2.75 1.02c.79-.22 1.65-.33 2.5-.33s1.71.11 2.5.33c1.91-1.29 2.75-1.02 2.75-1.02c.55 1.35.2 2.39.1 2.64c.65.71 1.03 1.6 1.03 2.71c0 3.82-2.34 4.66-4.57 4.91c.36.31.69.92.69 1.85V21c0 .27.16.59.67.5C19.14 20.16 22 16.42 22 12A10 10 0 0 0 12 2",[237,238,239],"span",{},"Folio Magazine on GitHub",{"title":241,"searchDepth":242,"depth":242,"links":243},"",2,[244,245,246,247],{"id":66,"depth":242,"text":67},{"id":97,"depth":242,"text":98},{"id":173,"depth":242,"text":174},{"id":197,"depth":242,"text":198},"Open-source magazine-style portfolio built with Nuxt, Tailwind, and TypeScript, focused on creative UI\u002FUX, responsive design, and easy content customization through image-based pages in 2024.","2024-02-15","A creative twist on the traditional portfolio, presenting work through an intuitive magazine interface","md","\u002Fassets\u002Fworks\u002FfolioMagazine.webp",{},5,true,[257,258],"Full Stack","UI\u002FUX Designer",{"title":14,"description":250},"Author",[262,263,264],"Nuxt","Tailwind","Typescript","https:\u002F\u002Ffoliomagazine.johanncvl.com\u002F","2024","ATuKGYFI4fsSkMhkK7cDw7MfwDNo9watYPDVzm_edzY",1778859912279]