Post

What is Devstagram?


Devstagram is social media for frontend developers, but you can also think of it like a shared portofolio website where people actually see you work. Here you can see projects in the proved most effective way: by scrolling, and you can upload you own projects in the feed. We belived that we solved the problem of project showcases getting buried on platforms like reddit, discord and X. We are committed to make all projects get the attention they deserve.

We are trying to provide the best user experience, so we are open for any idea about how we could develop this site. Contact us

For what can Devstagram be used?


You can share your projects, or the demo of the project and see how do people react on them. After a long programming session instead of watching TV or surf on the internet you can come on devstagram.com and watch peoples creations, and maybe get some inspiration to your next project. If you see something interesting in a project or you have a question about how something was done on it, you can ask the creator any time or see the code immediately at the description if the creator shared it. If you saw the code or simply just the project, you can write a proposal to the creator, about what he could do better.

Supported Languages


  • HTML
  • CSS
  • Javascript
  • ReactJS (soon)
  • NodeJS (soon)
  • Python (soon)
  • .NET (soon)

File Upload Roules (FUR)

Below you will find the correct way of implementing features in you program (HTML, CSS javascript, etc.) so it will be compatible with the devstagram system.

1. Linking a style, script, image or any other file in HTML

  • The given path must be without starter slash.
    • Incorrect 
                                                
<link rel="stylesheet" href="/style.css">
    Correct 
                                                
<link rel="stylesheet" href="style.css">

    2. The HTML title will not appear anywhere

    3. Centering

    If it's possible center elements with the flex, grid, etc. layouts rather than using top: 50%; left: 50% transform: translate(-50%, -50%).

    The "transform: translate" method may cause problems when rendering your website.

    Incorrect 
                                                
position: relative;
top: 50%;
left: 50%;
transform: translate(-50%, -50%)
    Correct 
                                                
display: flex;
align-items: center;
justify-content: center;

    That's all for now... :)